﻿   /* 全局样式重置 */
   * {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
       font-family: Arial, sans-serif;
   }

   html,
   body {
       width: 100%;
       max-width: 100%;
       overflow-x: hidden;
       line-height: 1.6;
       color: #333;
       background: #fff;
   }

   body {
       padding-top: 90px;
       /* 为固定头部预留空间 */
   }

   a {
       text-decoration: none;
       color: inherit;
   }

   ul {
       list-style: none;
   }

   .container {
       width: 100%;
       max-width: 1200px;
       margin: 0 auto;
       padding: 0 15px;
   }

   .btn {
       display: inline-block;
       padding: 8px 56px;
       background: #212123;
       color: #fff;
       border-radius: 20px;
       cursor: pointer;
       transition: background 0.3s;
   }

   .btn:hover {
       background: #9a1822;
   }

   .section-title {
       font-size: 28px;
       text-align: center;
       margin: 40px 0 30px;
       font-weight: bolder;
   }

   /* 头部导航 */
   header {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       background: rgba(255, 255, 255, 0.95);
       backdrop-filter: blur(10px);
       border-bottom: 1px solid #e0e0e0;
       z-index: 1000;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), 0 4px 20px rgba(0, 0, 0, 0.05);
   }

   .header-top {
       display: grid;
       grid-template-columns: auto 1fr auto;
       align-items: center;
       gap: 20px;
       padding: 20px 0;
       position: relative;
   }

   .logo {
       display: flex;
       flex-direction: column;
       justify-content: center;
       height: 60px;
       padding: 8px 0;
   }

   .logo img {
       height: 24px;
       margin-bottom: 2px;
   }

   .logo-text {
       font-size: 16px;
       color: #212123;
       line-height: 1.1;
       text-align: center;
   }

   .logo .underline {
       color: #db4646;
       border-bottom: #000 3px solid;
       b
   }

   .header-center {
       display: flex;
       flex-direction: column;
       gap: 0;
   }

   .header-nav {
       display: flex;
       align-items: center;
       justify-content: flex-end;
       gap: 20px;
   }

   .top-nav {
       display: flex;
       gap: 15px;
       font-size: 14px;
   }

   .top-nav a {
       cursor: pointer;
   }

   .search-box {
       position: relative;
   }

   .search-input {
       padding: 6px 10px 6px 30px;
       border: 1px solid #ddd;
       border-radius: 4px;
       font-size: 14px;
       width: 180px;
   }

   .search-icon {
       position: absolute;
       left: 8px;
       top: 50%;
       transform: translateY(-50%);
       color: #999;
   }

   .lang-switch {
       display: flex;
       border: 1px solid #ddd;
       border-radius: 20px;
       overflow: hidden;
   }

   .lang-btn {
       padding: 4px 10px;
       border: none;
       background: #fff;
       cursor: pointer;
       font-size: 14px;
   }

   .lang-btn.active {
       background: #212123;
       color: #fff;
   }

   .contact-wrapper {
       display: flex;
       align-items: center;
   }

   .contact-btn {
       background: #9a1822;
       color: #fff;
       border: none;
       padding: 28px 30px;
       font-size: 14px;
       cursor: pointer;
   }

   .header-main-nav {
       display: flex;
       justify-content: center;
       align-items: center;
       gap: 30px;
       padding: 0;
       font-size: 16px;
       position: relative;
   }

   .nav-item {
       position: relative;
   }

   /* 确保下拉菜单容器正确 */
   .header-main-nav {
       position: static;
   }

   .nav-item>a {
       color: #333;
       padding: 8px 0;
       display: inline-block;
   }

   .nav-item>a:hover {
       color: #212123;
   }

   /* 下拉菜单基础样式 - 通栏背景 */
   .submenu {
       position: fixed;
       top: 100px;
       left: 0;
       width: 100vw;
       background: #efeded !important;
       opacity: 0;
       visibility: hidden;
       pointer-events: none;
       transform: translateY(0);
       box-shadow: 0 18px 36px rgba(0, 0, 0, 0.12);
       z-index: 1000;
       /* 移除CSS过渡，让JavaScript控制延迟 */
       transition: none !important;
   }

   /* 确保下拉菜单容器正确 */
   .header-main-nav {
       position: static;
   }

   .nav-item {
       position: relative;
   }

   .nav-item.submenu-open .submenu {
       opacity: 1;
       visibility: visible;
       pointer-events: auto;
       transform: translateY(0);
       /* 只在打开时添加快速过渡 */
       transition: opacity 0.2s ease, visibility 0.2s ease;
   }



   .submenu a {
       color: #333;
       padding: 8px 10px;
       font-size: 14px;
       transition: color 0.2s ease, background 0.2s ease;
       display: block;
       pointer-events: auto !important;
       cursor: pointer;
       z-index: 1001;
       position: relative;
   }

   .submenu-right {
       pointer-events: auto !important;
       z-index: 1001;
   }

   .submenu-right a {
       pointer-events: auto !important;
       cursor: pointer;
       z-index: 1002;
       position: relative;
   }

   .submenu a:hover {
       color: #212123;
       background: rgba(181, 56, 34, 0.08);
       border-radius: 4px;
   }

   .submenu-inner {
       width: 100%;
       max-width: 1200px;
       margin: 0 auto;
       display: flex;
       justify-content: center;
       align-items: center;
       gap: 80px;
       padding: 20px 40px;
   }

   .submenu-left {
       display: flex;
       align-items: center;
       gap: 10px;
       flex: 0 0 auto;
   }

   .submenu-right {
       display: flex;
       gap: 24px;
       flex-wrap: wrap;
       justify-content: center;
       flex: 0 0 auto;
   }

   .submenu-label {
       font-size: 16px;
       font-weight: 600;
       color: #a82b2b;
   }

   .submenu-arrow {
       width: 32px;
       height: 32px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       border-radius: 50%;
       background: #212123;
       color: #fff;
       transition: transform 0.25s ease;
   }

   .nav-item:hover .submenu-arrow {
       transform: translateX(6px);
   }

   /* ====================== 汉堡菜单按钮（移动端） ====================== */
   .menu-toggle {
       display: none;
       flex-direction: column;
       gap: 5px;
       cursor: pointer;
       padding: 10px;
       position: absolute;
       right: 20px;
       top: 50%;
       transform: translateY(-50%);
       z-index: 1001;
   }

   .menu-toggle span {
       display: block;
       width: 28px;
       height: 3px;
       background: #212123;
       border-radius: 2px;
       transition: 0.3s;
   }



   /* 桌面端隐藏移动端首页按钮 */
   .mobile-home-btn {
       display: none;
   }

   /* ====================== 响应式导航 ====================== */
   @media (max-width: 992px) {
       body {
           padding-top: 80px;
       }

       .menu-toggle {
           display: flex;
       }

       .contact-wrapper {
           display: none;
       }

       .header-nav {
           display: none;
       }

       .header-center {
           position: fixed;
           top: 0;
           right: 0;
           width: 280px;
           height: 100vh;
           background: white;
           box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
           flex-direction: column;
           padding: 80px 20px 30px;
           transform: translateX(100%);
           transition: transform 0.35s ease;
           z-index: 999;
       }

       .header-center.show {
           transform: translateX(0);
       }

       .header-nav {
           flex-direction: column;
           align-items: flex-start;
           gap: 15px;
           margin-bottom: 20px;
       }

       .top-nav {
           flex-direction: column;
           gap: 10px;
       }

       .header-main-nav {
           flex-direction: column;
           align-items: flex-start;
           gap: 15px;
       }

       .nav-item {
           width: 100%;
       }

       /* 移动端下拉菜单样式 */
       .submenu {
           position: static;
           transform: none;
           opacity: 1;
           pointer-events: all;
           background: transparent !important;
           box-shadow: none;
           display: none;
           padding-left: 10px;
       }

       /* 移动端下拉菜单内容样式 */
       .submenu-inner {
           flex-direction: column;
           align-items: flex-start;
           gap: 10px;
           padding: 10px 0;
       }

       /* 移动端激活状态显示下拉菜单 */
       .nav-item.active .submenu {
           display: block;
       }

       .nav-item.active .submenu {
           display: block;
       }

       .submenu-inner {
           flex-direction: column;
           align-items: flex-start;
           gap: 10px;
           padding: 10px 0;
       }

       .submenu-left {
           display: none;
       }

       .submenu-right {
           flex-direction: column;
           align-items: flex-start;
           gap: 10px;
       }

       .nav-item.active .submenu {
           display: block;
       }
   }

   /* 通知栏 */
   .notice-bar {
       background: #fef7f5;
       padding: 10px 0;
       font-size: 12px;
       color: #d93025;
       text-align: center;
       margin: 10px 0;
   }

   /* Cookie提示 */
   .cookie-tip {
       position: fixed;
       bottom: 0;
       left: 0;
       width: 100%;
       background: #f5f5f5;
       padding: 10px 20px;
       display: flex;
       justify-content: space-between;
       align-items: center;
       font-size: 12px;
       z-index: 999;
   }

   .cookie-tip .btn {
       padding: 4px 12px;
       font-size: 12px;
   }

   /* 轮播图 */
   .banner {
       position: relative;
       height: 550px;
       overflow: hidden;
       margin-bottom: 20px;
   }

   .banner-slide {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       transform: translateX(100%);
       transition: transform 1s ease;
       will-change: transform;
   }

   .banner-slide.active {
       transform: translateX(0);
   }

   .banner-slide.prev {
       transform: translateX(-100%);
   }

   .banner-slide img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       object-position: center center;
   }

   /* 轮播文字动画 —— 延迟 + 慢速进入 */
   .banner-text {
       position: absolute;
       left: 10%;
       top: 50%;
       transform: translateY(-50%);
       z-index: 2;
       color: #043972;
       opacity: 0;

       font-weight: bold;
       text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black;
   }

   .banner-slide.active .banner-text {
       opacity: 1;
       /* 延迟 0.5s 再进入，动画时长 1.4s（更慢） */
       animation: textJumpIn 1.4s ease 0.5s forwards;
   }

   @keyframes textJumpIn {
       0% {
           transform: translateY(80px);
           opacity: 0;
       }

       100% {
           transform: translateY(-50%);
           opacity: 1;
       }
   }

   .slide-title {
       font-size: 42px;
       font-weight: bold;
       margin-bottom: 12px;
       background-color: #faf7f7;
       opacity: 0.8;
       border-radius: 20px;
       padding: 0px 30px;
       text-shadow: 0 2px 10px rgba(241, 237, 237, 0.3);
   }

   .slide-desc {
       font-size: 18px;
       margin-bottom: 30px;
       background-color: #faf7f7;
       border-radius: 20px;
       padding: 0px 30px;
       float: right;

       opacity: 0.8;
       text-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
   }

   /* 蓝色箭头按钮 */
   .slide-arrow-btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 50px;
       height: 50px;
       border-radius: 50%;
       background-color: #212123;
       transition: transform 0.3s ease, background 0.3s ease;
   }

   .slide-arrow-btn:hover {
       background-color: #9a1822;
       transform: scale(1.1);
   }

   .banner-dots {
       position: absolute;
       bottom: 15px;
       left: 50%;
       transform: translateX(-50%);
       display: flex;
       align-items: center;
       gap: 12px;
       background: rgba(0, 0, 0, 0.3);
       padding: 8px 16px;
       border-radius: 25px;
       backdrop-filter: blur(4px);
   }

   @media (max-width: 768px) {
       .banner-dots {
           display: none;
       }
   }

   .banner-dot {
       width: 12px;
       height: 12px;
       border-radius: 50%;
       background: rgba(255, 255, 255, 0.4);
       cursor: pointer;
       transition: all 0.3s ease;
       border: 2px solid transparent;
   }

   .banner-dot:hover {
       background: rgba(255, 255, 255, 0.6);
   }

   .banner-dot.active {
       background: #fff;
       border-color: rgba(255, 255, 255, 0.8);
   }

   .banner-play-pause {
       width: 32px;
       height: 32px;
       border-radius: 50%;
       background: rgba(255, 255, 255, 0.2);
       border: 2px solid rgba(255, 255, 255, 0.3);
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       margin-left: 8px;
       transition: all 0.3s ease;
       color: #fff;
   }

   .banner-play-pause:hover {
       background: rgba(255, 255, 255, 0.3);
       border-color: rgba(255, 255, 255, 0.5);
       transform: scale(1.05);
   }

   .banner-play-pause.playing .pause-icon {
       display: block;
   }

   .banner-play-pause.playing .play-icon {
       display: none;
   }

   .banner-play-pause.paused .pause-icon {
       display: none;
   }

   .banner-play-pause.paused .play-icon {
       display: block;
   }

   /* 新闻模块 */
   .news-section {
       margin: 40px 0;
   }

   .news-list {
       max-width: 800px;
       margin: 0 auto;
   }

   .news-item {
       display: flex;
       justify-content: space-between;
       padding: 20px 0;
       border-bottom: 1px solid #b4b2b2;
       font-size: 16px;
       align-items: center;
   }

   .news-item span {
       margin-right: 20px;
       width: 80px;
   }

   .news-date {
       color: #999;
       margin-right: 10px;
       width: 80px;
   }

   .news-type {
       color: #212123;
       width: 80px;
       margin-right: 30px;
   }

   .news-title {
       flex: 1;
       margin: 0 10px;

   }

   .news-tag {
       font-weight: 600;
       color: #9a1822;
   }

   .news-title a:hover {
       color: #000;

   }

   .news-more {
       text-align: center;
       margin-top: 20px;
   }

   /* 箭头图标容器 */
   .arrow-icon {
       width: 30px;
       height: 30px;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 50%;
       transition: all 0.3s ease;
       flex-shrink: 0;
   }

   /* 箭头图标样式 */
   .arrow-icon svg {
       width: 16px;
       height: 16px;
       fill: #999;
       transition: fill 0.3s ease;
   }

   /* 鼠标悬浮时的样式 */
   .news-item:hover .arrow-icon {
       background-color: #9a1822;
   }

   .news-item:hover .arrow-icon svg {
       fill: white;
   }

   /* 新闻模块移动端适配 */
   @media (max-width: 768px) {
       .news-list {
           padding: 0 15px;
       }

       .news-item {
           flex-wrap: wrap;
           gap: 10px;
           padding: 15px 0;
       }

       .news-item span {
           margin-right: 10px;
           width: auto;
           flex-shrink: 0;
       }

       .news-date {
           width: auto;
           margin-right: 15px;
           font-size: 14px;
       }

       .news-type {
           width: auto;
           margin-right: 0;
           font-size: 14px;
       }

       .news-title {
           width: 100%;
           margin: 0;
           font-size: 14px;
           order: 3;
       }
   }

   /* 产品模块 */
   .products-section {
       margin: 60px 0;
       width: 100%;
       overflow: hidden;
   }

   .product-tabs {
       display: flex;
       gap: 10px;
       width: 100%;
       padding-bottom: 10px;
       margin-bottom: 30px;
   }

   .product-tab {
       padding: 8px 16px;
       background: #f5f5f5;
       border-radius: 4px;
       white-space: nowrap;
       cursor: pointer;
       flex-shrink: 0;
   }

   .product-tab.active {
       background: #212123 color: #fff;
   }

   .product-detail {
       display: flex;
       gap: 30px;
       align-items: center;
   }

   .product-img {
       flex: 1;

   }

   .product-image img {
       width: 100%;
       border-radius: 4px;
   }

   .product-desc {
       flex: 1;
       font-size: 14px;
       line-height: 1.8;
   }

   /* 应用场景模块 */
   .applications-section {
       margin: 60px 0;
   }

   .apps-grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 20px;
   }

   .app-item {
       display: flex;
       flex-direction: column;
       border-radius: 4px;
       overflow: hidden;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   }

   .app-item img {
       width: 100%;
       height: 200px;
       object-fit: cover;
       transition: transform 0.3s ease;
   }

   .app-item.certification-item img {
       width: 100%;
       height: 500px;
       object-fit: cover;
       transition: transform 0.3s ease;
   }

   .app-item:hover img {
       transform: scale(1.1);
   }

   .app-text {
       padding: 10px;
       background: #fff;
   }

   .top-line {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 5px;
   }

   .english {
       font-size: 14px;
       font-weight: bold;
       color: #333;
   }

   .chinese {
       font-size: 12px;
       color: #666;
   }

   .app-arrow {
       width: 30px;
       height: 30px;
       border-radius: 50%;
       background: #212123;
       color: #fff;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 16px;
       transition: transform 0.3s ease;
       cursor: pointer;
   }

   .app-item:hover .app-arrow {
       transform: scale(1.1);
       background: #9a1822;
   }

   /* 技术支持模块 */
   .tech-support-section {
       margin: 60px 0;
       padding: 0 15px;
   }

   .tech-content {
       display: flex;
       flex-direction: column;
       gap: 40px;
       max-width: 100%;
   }

   .tech-item {
       display: flex;
       gap: 30px;
       align-items: center;
       max-width: 100%;
       width: 100%;
   }

   .tech-img {
       flex: 1;
       max-width: 100%;
       width: 100%;
   }

   .tech-img img {
       width: 100%;
       height: auto;
       max-height: 300px;
       object-fit: contain;
   }

   .tech-img img {
       width: 100%;
       height: auto;
       max-height: 400px;
       border-radius: 4px;
       object-fit: contain;
   }

   .tech-text {
       flex: 1;
       font-size: 14px;
       line-height: 1.8;
       max-width: 100%;
       word-wrap: break-word;
       overflow-wrap: break-word;
   }

   .tech-text.p {
       word-break: break-all;

   }

   .tech-text.span {
       word-break: break-all;

   }

   .tech-text-p {
       word-break: break-word;
       hyphens: auto;
       font-size: 14px;
       line-height: 1.8;
   }

   /* 可持续发展模块 */
   .sustainability-section {
       margin: 60px 0;
       position: relative;
       height: 400px;
   }

   .sustain-bg {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.25)),
           url('../../static/images/ba01.jpg') no-repeat center center;
       background-size: cover;
       opacity: 1;
   }

   .sustain-content {
       position: relative;
       z-index: 1;
       height: 100%;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       color: #fff;
       text-align: center;
       padding: 0 20px;
   }

   .sustain-title {
       font-size: 32px;
       margin-bottom: 20px;
   }

   .sustain-desc {
       max-width: 800px;
       font-size: 16px;
       margin-bottom: 30px;
   }

   /* 底部 */
   footer {
       background: #e2e2e2;
       padding: 40px 0 20px;
       margin-top: 60px;
   }

   .footer-top {
       display: flex;
       justify-content: space-between;
       flex-wrap: wrap;
       gap: 30px;
       margin-bottom: 30px;
   }

   .footer-col {
       flex: 1;
       min-width: 200px;
   }

   .footer-col h3 {
       font-size: 16px;
       margin-bottom: 15px;
       font-weight: normal;
   }

   .footer-col ul {
       font-size: 12px;
       line-height: 2;
   }

   .footer-col ul li:hover {
       color: #212123;
   }

   .footer-bottom {
       text-align: center;
       font-size: 12px;
       color: #999;
       padding-top: 20px;
       border-top: 1px solid #eee;
   }

   /* 响应式适配 */
   @media (max-width: 768px) {
       .header-top {
           grid-template-columns: 1fr;
       }

       /* 手机端隐藏logo中的英文公司名，保留中文logo-text */
       .logo>div:first-of-type {
           display: none !important;
       }

       /* 手机端在中文logo前添加poly红色加粗字样 */
       .logo-text {
           position: relative;
           padding-left: 0px;
       }

       /* 移动端分页样式 */
       .pagination-wrapper {
           margin-top: 20px;
           padding: 0 15px;
       }

       .pagination a,
       .pagination span {
           min-width: 32px;
           height: 32px;
           padding: 0 8px;
           font-size: 12px;
       }

       .pagination .pageinfo {
           display: none;
       }

       .pagination .prev,
       .pagination .next {
           padding: 0 10px;
       }

       /* 移动端分页样式 */
       .pagination-wrapper {
           margin-top: 20px;
           padding: 0 15px;
       }

       .pagination a,
       .pagination span {
           min-width: 32px;
           height: 32px;
           padding: 0 8px;
           font-size: 12px;
       }

       .pagination .pageinfo {
           display: none;
       }

       .pagination .prev,
       .pagination .next {
           padding: 0 10px;
       }

       /* 移动端分页样式 */
       .pagination-wrapper {
           margin-top: 20px;
           padding: 0 15px;
       }

       .pagination a,
       .pagination span {
           min-width: 32px;
           height: 32px;
           padding: 0 8px;
           font-size: 12px;
       }

       .pagination .pageinfo {
           display: none;
       }

       .pagination .prev,
       .pagination .next {
           padding: 0 10px;
       }

       .logo-text::before {
           content: 'POLY';
           position: absolute;
           left: 0;
           top: 50%;
           transform: translateY(-50%);
           color: #e61825;
           font-weight: 900;
           font-size: 18px;
           margin-right: 0px;
       }

       /* 手机端隐藏logo中的英文图片，保留中文logo-text */
       .logo img {
           display: none;
       }



       .banner {
           height: 180px;
       }

       .banner-slide img {
           object-fit: cover;
           object-position: top center;
       }

       /* 通用图片响应式修复 - 确保所有图片在移动端完整显示 */
       .tech-support-section img,
       .tech-content img,
       .tech-item img,
       .tech-text img,
       [news:info] img,
       [news:desc] img,
       .container img {
           width: 100% !important;
           height: auto !important;
           max-width: 100% !important;
           max-height: 300px !important;
           object-fit: contain !important;
           display: block !important;
           margin: 10px auto !important;
           padding: 0 !important;
           border: none !important;
       }

       /* 首页产品区域移动端上下排列 */
       .content-block {
           flex-direction: column !important;
           width: 100%;
       }

       .product-image {
           width: 100% !important;
           min-height: auto;
           max-height: none;
           margin-bottom: 20px;
       }

       .product-details {
           width: 100% !important;
           padding: 0 15px;
       }

       .slide-title {
           font-size: 24px;
           padding: 8px 15px;
       }

       .slide-desc {
           font-size: 14px;
           float: none;
           padding: 8px 15px;
       }

       .banner-text {
           left: 5%;
           right: 5%;
           top: 70%;
           transform: translateY(-70%);
           padding-top: 30px;
       }

       .product-detail,
       .tech-item {
           flex-direction: column;
           gap: 20px;
           padding: 0;
       }

       .tech-text {
           padding: 0;
           font-size: 14px;
           line-height: 1.8;
           width: 100%;
           box-sizing: border-box;
       }

       .tech-support-section {
           padding: 0 15px;
           margin: 40px 0;
       }

       .sustainability-section {
           height: auto;
           min-height: 250px;
           padding: 40px 0;
       }

       .sustain-title {
           font-size: 20px;
       }

       .sustain-desc {
           font-size: 14px;
       }

       .apps-grid {
           grid-template-columns: repeat(2, 1fr);
       }

       .footer-top {
           flex-direction: column;
           align-items: center;
           text-align: center;
       }

       .footer-col {
           text-align: center;
           align-items: center;
       }

       .footer-col ul {
           text-align: center;
       }
   }

   @media (max-width: 480px) {
       body {
           font-size: 14px;
       }

       .section-title {
           font-size: 22px;
           margin: 20px 0 15px;
       }

       .apps-grid {
           grid-template-columns: 1fr;
       }

       .sustain-title {
           font-size: 20px;
       }
   }

   /* 标题样式 */
   .page-title {
       text-align: center;
       font-size: 32px;
       font-weight: 500;
       color: #333;
       margin-bottom: 30px;
   }

   /* 导航栏容器 */
   .nav-tabs {
       display: flex;
       align-items: center;
       position: relative;
       margin-bottom: 20px;
       overflow-x: auto;
       scrollbar-width: none;
       /* 隐藏滚动条 */
   }

   .nav-tabs::-webkit-scrollbar {
       display: none;
   }

   /* 导航按钮样式 */
   .nav-tab {
       padding: 8px 20px;
       background-color: #f5f5f5;
       border: none;
       color: #333;
       font-size: 16px;
       cursor: pointer;
       margin-right: 10px;
       border-radius: 0;
       transition: background-color 0.3s ease, color 0.3s ease;
       white-space: nowrap;
       flex-shrink: 0;
   }

   /* 默认选中态 */
   .nav-tab.active {
       background-color: #9a1822;
       color: white;
   }

   /* 鼠标悬浮效果（非选中态） */
   .nav-tab:not(.active):hover {
       background-color: #e0e0e0;
       color: #212123;
   }

   /* 内容展示区 */
   .content-area {
       display: flex;
       margin-top: 20px;
       flex-wrap: wrap;
   }

   /* 产品图片/背景区 */
   .product-image {
       flex: 1;
       display: block;
       background: transparent;
   }

   .product-image img {
       width: 100%;
       height: auto;
       display: block;
   }

   /* 产品详情区 */
   .product-details {
       flex: 1;
       padding: 0 30px;
       display: flex;
       flex-direction: column;
       justify-content: center;
   }

   /* 产品标题 */
   .product-title {
       font-size: 24px;
       color: #333;
       margin-bottom: 15px;
       font-weight: 500;
   }

   /* 产品描述 */
   .product-desc {
       font-size: 16px;
       line-height: 1.6;
       color: #666;
       margin-bottom: 20px;
   }

   /* 阅读更多按钮 */
   .read-more-btn {
       display: inline-block;
       padding: 10px 30px;
       background-color: #212123;
       color: white;
       text-decoration: none;
       border-radius: 25px;
       font-size: 16px;
       transition: background-color 0.3s ease;
       width: fit-content;
   }

   .read-more-btn:hover {
       background-color: #9a1822;
   }

   /* 内容块默认隐藏 */
   .content-block {
       display: none;
   }

   /* 激活的内容块显示 */
   .content-block.active {
       display: flex;
   }

   .bj {
       opacity: 0.8;
   }

   /* 分页样式 */
   .pagination-wrapper {
       display: flex;
       justify-content: center;
       align-items: center;
       margin-top: 40px;
       gap: 8px;
   }

   .pagination {
       display: flex;
       gap: 8px;
       align-items: center;
   }

   .pagination a,
   .pagination span {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       min-width: 36px;
       height: 36px;
       padding: 0 12px;
       border: 1px solid #ddd;
       border-radius: 4px;
       text-decoration: none;
       color: #333;
       font-size: 14px;
       transition: all 0.3s ease;
   }

   .pagination a:hover {
       background: #f5f5f5;
       border-color: #9a1822;
       color: #9a1822;
   }

   .pagination .current {
       background: #9a1822;
       color: #fff;
       border-color: #9a1822;
   }

   .pagination .pageinfo {
       border: none;
       padding: 0 15px;
   }

   .pagination .prev,
   .pagination .next {
       padding: 0 15px;
   }

   .pagination .disabled {
       opacity: 0.5;
       cursor: not-allowed;
   }

   .pagination .disabled:hover {
       background: transparent;
       border-color: #ddd;
       color: #333;
   }

   /* 分页样式 */
   .pagination-wrapper {
       display: flex;
       justify-content: center;
       align-items: center;
       margin-top: 40px;
       gap: 8px;
   }

   .pagination {
       display: flex;
       gap: 8px;
       align-items: center;
   }

   .pagination a,
   .pagination span {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       min-width: 36px;
       height: 36px;
       padding: 0 12px;
       border: 1px solid #ddd;
       border-radius: 4px;
       text-decoration: none;
       color: #333;
       font-size: 14px;
       transition: all 0.3s ease;
   }

   .pagination a:hover {
       background: #f5f5f5;
       border-color: #9a1822;
       color: #9a1822;
   }

   .pagination .current {
       background: #9a1822;
       color: #fff;
       border-color: #9a1822;
   }

   .pagination .pageinfo {
       border: none;
       padding: 0 15px;
   }

   .pagination .prev,
   .pagination .next {
       padding: 0 15px;
   }

   .pagination .disabled {
       opacity: 0.5;
       cursor: not-allowed;
   }

   .pagination .disabled:hover {
       background: transparent;
       border-color: #ddd;
       color: #333;
   }

   /* 在线留言表单样式 */
   .contact-form-section {
       margin: 60px 0;
       padding: 40px 0;
       background: #f8f9fa;
   }

   .contact-form-wrapper {
       max-width: 800px;
       margin: 0 auto;
       background: #fff;
       padding: 40px;
       border-radius: 8px;
       box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
   }

   .contact-form {
       display: flex;
       flex-direction: column;
       gap: 20px;
   }

   .form-row {
       display: flex;
       gap: 20px;
   }

   .form-group {
       flex: 1;
       display: flex;
       flex-direction: column;
   }

   .form-group label {
       font-size: 14px;
       font-weight: 500;
       color: #333;
       margin-bottom: 8px;
   }

   .form-group input,
   .form-group select,
   .form-group textarea {
       padding: 12px 15px;
       border: 1px solid #ddd;
       border-radius: 4px;
       font-size: 14px;
       transition: border-color 0.3s ease, box-shadow 0.3s ease;
       background: #fff;
   }

   .form-group input:focus,
   .form-group select:focus,
   .form-group textarea:focus {
       outline: none;
       border-color: #9a1822;
       box-shadow: 0 0 0 3px rgba(154, 24, 34, 0.1);
   }

   .form-group textarea {
       resize: vertical;
       min-height: 120px;
   }

   .form-actions {
       flex-direction: row;
       justify-content: flex-end;
       gap: 15px;
       margin-top: 10px;
   }

   .btn-primary {
       background: #9a1822;
       color: #fff;
       border: none;
       padding: 12px 30px;
       border-radius: 4px;
       font-size: 14px;
       cursor: pointer;
       transition: background 0.3s ease;
   }

   .btn-primary:hover {
       background: #7a131c;
   }

   .btn-secondary {
       background: #f0f0f0;
       color: #333;
       border: 1px solid #ddd;
       padding: 12px 30px;
       border-radius: 4px;
       font-size: 14px;
       cursor: pointer;
       transition: background 0.3s ease;
   }

   .btn-secondary:hover {
       background: #e0e0e0;
   }

   /* 表单成功提示 */
   .form-success {
       text-align: center;
       padding: 40px;
   }

   .success-icon {
       width: 60px;
       height: 60px;
       margin: 0 auto 20px;
       background: #28a745;
       color: #fff;
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 30px;
       font-weight: bold;
   }

   .form-success h3 {
       font-size: 24px;
       color: #333;
       margin-bottom: 10px;
   }

   .form-success p {
       color: #666;
   }

   /* 表单响应式适配 */
   @media (max-width: 768px) {
       .contact-form-wrapper {
           padding: 20px;
           margin: 0 15px;
       }

       .form-row {
           flex-direction: column;
       }

       .form-group {
           width: 100%;
       }

       .form-actions {
           flex-direction: column;
       }

       .btn-primary,
       .btn-secondary {
           width: 100%;
           padding: 12px;
       }
   }

   /* 在线留言表单样式 */
   .contact-form-section {
       margin: 60px 0;
       padding: 40px 0;
       background: #f8f9fa;
   }

   .contact-form-wrapper {
       max-width: 800px;
       margin: 0 auto;
       background: #fff;
       padding: 40px;
       border-radius: 8px;
       box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
   }

   .contact-form {
       display: flex;
       flex-direction: column;
       gap: 20px;
   }

   .form-row {
       display: flex;
       gap: 20px;
   }

   .form-group {
       flex: 1;
       display: flex;
       flex-direction: column;
   }

   .form-group label {
       font-size: 14px;
       font-weight: 500;
       color: #333;
       margin-bottom: 8px;
   }

   .form-group input,
   .form-group select,
   .form-group textarea {
       padding: 12px 15px;
       border: 1px solid #ddd;
       border-radius: 4px;
       font-size: 14px;
       transition: border-color 0.3s ease, box-shadow 0.3s ease;
       background: #fff;
   }

   .form-group input:focus,
   .form-group select:focus,
   .form-group textarea:focus {
       outline: none;
       border-color: #9a1822;
       box-shadow: 0 0 0 3px rgba(154, 24, 34, 0.1);
   }

   .form-group textarea {
       resize: vertical;
       min-height: 120px;
   }

   .form-actions {
       flex-direction: row;
       justify-content: flex-end;
       gap: 15px;
       margin-top: 10px;
   }

   .btn-primary {
       background: #9a1822;
       color: #fff;
       border: none;
       padding: 12px 30px;
       border-radius: 4px;
       font-size: 14px;
       cursor: pointer;
       transition: background 0.3s ease;
   }

   .btn-primary:hover {
       background: #7a131c;
   }

   .btn-secondary {
       background: #f0f0f0;
       color: #333;
       border: 1px solid #ddd;
       padding: 12px 30px;
       border-radius: 4px;
       font-size: 14px;
       cursor: pointer;
       transition: background 0.3s ease;
   }

   .btn-secondary:hover {
       background: #e0e0e0;
   }

   /* 表单成功提示 */
   .form-success {
       text-align: center;
       padding: 40px;
   }

   .success-icon {
       width: 60px;
       height: 60px;
       margin: 0 auto 20px;
       background: #28a745;
       color: #fff;
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 30px;
       font-weight: bold;
   }

   .form-success h3 {
       font-size: 24px;
       color: #333;
       margin-bottom: 10px;
   }

   .form-success p {
       color: #666;
   }

   /* 表单响应式适配 */
   @media (max-width: 768px) {
       .contact-form-wrapper {
           padding: 20px;
           margin: 0 15px;
       }

       .form-row {
           flex-direction: column;
       }

       .form-group {
           width: 100%;
       }

       .form-actions {
           flex-direction: column;
       }

       .btn-primary,
       .btn-secondary {
           width: 100%;
           padding: 12px;
       }
   }