/* 仅在移动端加载的覆盖样式：不改动电脑端布局 */

/* 导航栏页面加载动画关键帧 */
@keyframes headerSlideIn {
  0% {
    transform: translateY(-100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

/* 菜单滑出动画关键帧 */
@keyframes menuSlideIn {
  0% {
    transform: translateX(-100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes menuSlideOut {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(-100%);
    opacity: 0;
  }
}

/* 菜单项逐项动画关键帧 */
@keyframes menuItemSlideIn {
  0% {
    transform: translateX(-30px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

/* 背景遮罩动画关键帧 */
@keyframes overlayFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes overlayFadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* 基础：容器与排版微调 */
@media (max-width: 992px) {
  body { padding-top: 56px; }
  .container { padding-left: 16px; padding-right: 16px; }
}

/* 头部与导航（移动端） - 简约版本 */
@media (max-width: 992px) {
  /* 固定头部样式 - 黑色背景设计（页面加载动画 + 滚动冻结） */
  .header { 
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
    padding: 12px 0; 
    z-index: 2000; 
    background: rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(20px);
    box-shadow: 0 2px 15px rgba(0,0,0,0.3);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    /* 页面加载时的初始状态 */
    transform: translateY(-100%);
    opacity: 0;
    /* 页面加载动画 */
    animation: headerSlideIn 0.8s ease-out 0.2s forwards;
  }
  
  /* 页面加载完成后移除动画，进入冻结状态 */
  .header.loaded {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    transition: none !important;
    will-change: auto !important;
  }
  
  .header .container { 
    position: relative; 
    margin-right: 60px; 
    max-width: calc(100% - 60px); 
    display: flex;
    align-items: center;
    /* 确保容器也无动画效果 */
    transition: none !important;
    transform: none !important;
    animation: none !important;
  }
  
  /* Logo 样式 - 黑色背景适配（位置固定，允许大小变化） */
  .logo { 
    margin-left: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    /* 确保logo容器位置固定，但允许内容变化 */
    position: relative;
    flex-shrink: 0;
  }
  
  .logo img { 
    max-height: 24px !important; 
    margin: 0 !important; 
    filter: brightness(1.1) contrast(1.1);
    /* 允许大小过渡，但移除位置变换 */
    transition: max-height 0.3s ease, opacity 0.3s ease !important;
    transform: none !important;
    animation: none !important;
    will-change: max-height, opacity;
  }
  
  /* 移动端滚动时logo大小保持不变 */
  .header.scrolled .logo img {
    max-height: 24px !important;
  }
  
  .logo img:hover {
    opacity: 0.95;
    transition: opacity 0.3s ease !important;
    transform: none !important;
  }

  /* 移动端导航菜单 - 左侧滑出设计 */
  .nav { 
    position: fixed !important;
    top: 0 !important;
    left: -100% !important;
    width: 280px !important;
    height: 100vh !important;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%) !important;
    backdrop-filter: blur(20px) !important;
    z-index: 3000 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.3) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    /* 初始状态 */
    opacity: 0;
    transform: translateX(-20px);
  }
  
  .nav.active { 
    left: 0 !important;
    opacity: 1;
    transform: translateX(0);
    animation: menuSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  }
  
  /* 菜单背景遮罩 */
  .nav::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  
  .nav.active::before {
    opacity: 1;
    visibility: visible;
    animation: overlayFadeIn 0.3s ease forwards;
  }
  
  .nav a { 
    color: #ffffff !important; 
    text-shadow: none !important; 
    font-weight: 400;
    transition: all 0.3s ease;
  }
  
  .nav a:hover {
    color: #83913d !important;
    background: rgba(131, 145, 61, 0.1) !important;
  }
  
  .nav a:after { display: none !important; }

  /* 一级菜单纵向排列 - 左侧滑出版本 */
  .nav ul { 
    display: flex !important; 
    flex-direction: column !important; 
    gap: 0 !important; 
    padding: 80px 0 20px 0 !important; 
    background: transparent !important; 
    position: relative !important; 
    z-index: 1 !important; 
    margin: 0 !important;
  }
  
  .nav ul li { 
    border-bottom: 1px solid rgba(255,255,255,0.1) !important; 
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.3s ease;
    position: relative;
  }
  
  .nav ul li:last-child { 
    border-bottom: none !important; 
  }
  
  .nav ul li:hover {
    background-color: rgba(131, 145, 61, 0.15) !important;
  }
  
  /* 移动端菜单项逐项动画 - 改进 */
  .nav.active ul li {
    opacity: 1;
    transform: translateX(0);
    animation: menuItemSlideIn 0.4s ease forwards;
  }
  
  .nav.active ul li:nth-child(1) { animation-delay: 0.1s; }
  .nav.active ul li:nth-child(2) { animation-delay: 0.15s; }
  .nav.active ul li:nth-child(3) { animation-delay: 0.2s; }
  .nav.active ul li:nth-child(4) { animation-delay: 0.25s; }
  .nav.active ul li:nth-child(5) { animation-delay: 0.3s; }
  .nav.active ul li:nth-child(6) { animation-delay: 0.35s; }
  .nav.active ul li:nth-child(7) { animation-delay: 0.4s; }

  /* 主菜单项样式 - 优化触摸交互 */
  .nav > ul > li > a {
    padding: 18px 25px !important; /* 增加垂直内边距 */
    font-weight: 500;
    font-size: 16px !important;
    display: block;
    transition: all 0.3s ease;
    position: relative;
    border-left: 3px solid transparent;
    /* 触摸友好的最小高度 */
    min-height: 48px;
    /* 触摸反馈优化 */
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.2);
    tap-highlight-color: rgba(131, 145, 61, 0.2);
    /* 确保触摸操作流畅 */
    touch-action: manipulation;
  }
  
  .nav > ul > li > a:hover {
    border-left-color: #83913d;
    padding-left: 30px !important;
  }
  
  /* 触摸按下状态 */
  .nav > ul > li > a:active {
    background: rgba(131, 145, 61, 0.25) !important;
    transform: translateX(2px);
  }
  
  /* 焦点状态 */
  .nav > ul > li > a:focus {
    outline: 2px solid #83913d;
    outline-offset: -2px;
    background: rgba(131, 145, 61, 0.1) !important;
  }
  
  /* 下拉菜单箭头指示器 */
  .nav .dropdown > a::after {
    content: '▼';
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
    transition: all 0.3s ease;
  }
  
  .nav .dropdown.active > a::after {
    transform: translateY(-50%) rotate(180deg);
    color: #83913d;
  }

  /* 下拉菜单 - 左侧滑出设计 */
  .nav .dropdown-menu { 
    position: static !important; 
    opacity: 1 !important; 
    visibility: visible !important; 
    transform: none !important; 
    box-shadow: none !important; 
    border: none !important; 
    background: rgba(0, 0, 0, 0.2) !important; 
    padding: 0 !important; 
    margin: 0 !important;
    border-radius: 0 !important;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
  }
  
  .nav .dropdown.active .dropdown-menu {
    max-height: 300px;
  }
  
  .nav .dropdown-menu a { 
    padding: 15px 25px 15px 40px !important; 
    color: rgba(255, 255, 255, 0.8) !important; 
    font-size: 14px !important;
    font-weight: 400;
    display: block;
    transition: all 0.3s ease;
    border-left: 3px solid transparent;
  }
  
  .nav .dropdown-menu a:hover {
    color: #83913d !important;
    background: rgba(131, 145, 61, 0.1) !important;
    border-left-color: #83913d;
    padding-left: 45px !important;
  }

  /* 语言切换器样式 - 左侧滑出版本 */
  .nav .language-switcher {
    padding: 20px 25px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin-top: 20px !important;
  }
  
  .nav .language-switcher .language-link {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    transition: all 0.3s ease !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    display: inline-block !important;
  }
  
  .nav .language-switcher .language-link:hover {
    color: #83913d !important;
    background: rgba(131, 145, 61, 0.1) !important;
  }
  
  .nav .language-separator {
    color: rgba(255, 255, 255, 0.3) !important;
    margin: 0 8px !important;
    font-size: 14px !important;
  }
  
  .flag-icon {
    width: 16px !important;
    height: 12px !important;
    margin-right: 6px !important;
    vertical-align: middle !important;
  }

  /* 汉堡图标 - 优化触摸交互体验 */
  .mobile-menu { 
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 48px;  /* 增加触摸区域 */
    height: 48px; /* 增加触摸区域 */
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    border-radius: 12px;
    background: transparent;
    border: none;
    /* 触摸友好的最小尺寸 44x44px */
    min-width: 44px;
    min-height: 44px;
    /* 添加触摸反馈 */
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.2);
    tap-highlight-color: rgba(131, 145, 61, 0.2);
    /* 平滑的触摸反馈动画 */
    transition: background-color 0.2s ease, transform 0.1s ease !important;
    /* 确保在触摸设备上的可访问性 */
    touch-action: manipulation;
  }
  
  .mobile-menu:hover {
    background: rgba(255,255,255,0.15);
  }
  
  /* 触摸按下状态 */
  .mobile-menu:active {
    background: rgba(255,255,255,0.25);
    transform: translateY(-50%) scale(0.95);
  }
  
  /* 焦点状态优化 */
  .mobile-menu:focus {
    outline: 2px solid #83913d;
    outline-offset: 2px;
    background: rgba(255,255,255,0.1);
  }
  
  /* 汉堡图标线条 - 完全静止（无任何动画） */
  .mobile-menu span {
    width: 20px;
    height: 2px;
    background: #ffffff;
    border-radius: 1px;
    margin: 3px 0;
    transform-origin: center;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    /* 强制移除所有动画效果 */
    transition: none !important;
    transform: none !important;
    animation: none !important;
    will-change: auto !important;
  }
  
  /* 汉堡图标激活动画 - 简约版本 */
  .mobile-menu.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
    background: #ffffff;
  }
  
  .mobile-menu.active span:nth-child(2) {
    opacity: 0;
    transform: scale(0);
  }
  
  .mobile-menu.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
    background: #ffffff;
  }
  
  /* 汉堡图标激活时的容器 */
  .mobile-menu.active {
    background: rgba(255, 255, 255, 0.15);
  }
  

  
  /* 菜单滚动条样式 */
  .nav::-webkit-scrollbar {
    width: 4px;
  }
  
  .nav::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
  }
  
  .nav::-webkit-scrollbar-thumb {
    background: rgba(131, 145, 61, 0.5);
    border-radius: 2px;
  }
  
  .nav::-webkit-scrollbar-thumb:hover {
    background: rgba(131, 145, 61, 0.7);
  }
  
  /* 菜单项悬停效果增强 */
  .nav > ul > li > a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 0;
    background: #83913d;
    transition: height 0.3s ease;
  }
  
  .nav > ul > li > a:hover::before {
    height: 100%;
  }
  
  /* 下拉菜单展开动画优化 */
  .nav .dropdown-menu {
    transform-origin: top;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  /* 菜单项激活状态 */
  .nav > ul > li > a.active {
    background: rgba(131, 145, 61, 0.2) !important;
    border-left-color: #83913d !important;
    color: #83913d !important;
  }
  
  /* 菜单背景渐变动画 */
  .nav {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 50%, #2c3e50 100%) !important;
    background-size: 200% 200% !important;
    animation: gradientShift 10s ease infinite;
  }
  
  @keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }
  
  /* 菜单打开时的背景动画 */
  .nav.active {
    animation: menuSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards, gradientShift 10s ease infinite;
  }
}

/* 轮播图移动端优化 */
@media (max-width: 992px) {
  /* 轮播图容器 - 紧贴导航栏无间距 */
  .hero-slider { 
    height: 400px !important; 
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    margin: -12px 0 0 0 !important;
    padding: 0 !important;
    top: 0 !important;
    width: 100% !important;
  }
  
  /* 轮播图幻灯片 - 确保完整显示 */
  .hero-slider .slide {
    width: 100% !important;
    height: 400px !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.5s ease, visibility 0.5s ease !important;
  }
  
  /* 活动幻灯片显示 */
  .hero-slider .slide.active {
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 2 !important;
  }
  
  /* 轮播图容器设置 */
  .hero-slider .slider-container {
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
  }
  
  /* 轮播图内容覆盖层 - 简化 */
  .hero-slider .slide::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  /* 轮播图标语 - 简约样式 */
  .hero-slogans {
    right: 35% !important;
    top: 45% !important;
    z-index: 3;
    gap: 10px !important;
    position: absolute !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
  }
  
  .hero-slogans img {
    height: 35px !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
    transition: opacity 0.3s ease;
  }
  
  /* 第二张轮播图特殊标语图片 - 覆盖内联样式 */
  .hero-slider .hero-slogans .slogan3,
  .hero-slider .slide .hero-slogans .slogan3 {
    position: relative !important;
    display: block !important;
    margin-bottom: 6px !important;
    height: 25px !important;
    width: auto !important;
    align-self: flex-end !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 5 !important;
    transform: none !important;
    left: 0 !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
  }
  
  .hero-slider .hero-slogans .slogan4,
  .hero-slider .slide .hero-slogans .slogan4 {
    position: relative !important;
    display: block !important;
    height: 15px !important;
    width: auto !important;
    align-self: flex-end !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 5 !important;
    transform: none !important;
    left: 0 !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
  }
  
  /* 轮播图导航按钮 - 简约设计 */
  .prev-nav, .next-nav {
    width: 44px !important;
    height: 44px !important;
    background: rgba(255,255,255,0.9) !important;
    border: none !important;
    color: #333 !important;
    font-size: 18px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
    cursor: pointer !important;
  }
  
  .prev-nav {
    left: 15px !important;
  }
  
  .next-nav {
    right: 15px !important;
  }
  
  .prev-nav:hover, .next-nav:hover {
    background: #83913d !important;
    color: white !important;
  }
  
  /* 轮播指示器 - 透明背景设计 */
  .slider-pagination {
    background: transparent !important;
    padding: 4px 8px !important;
    border-radius: 15px !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5) !important;
    position: absolute !important;
    bottom: 10px !important;
    right: 20px !important;
    z-index: 10 !important;
    pointer-events: none !important;
  }
  
  /* 覆盖原样式中的字体大小 */
  .slider-pagination .current-slide,
  .slider-pagination .separator,
  .slider-pagination .total-slides {
    font-size: 12px !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5) !important;
  }
}

@media (max-width: 768px) {
  /* 小屏幕轮播图进一步优化 */
  .hero-slider { height: 370px !important; }
  .hero-slider .slide { height: 370px !important; }
  
  /* 中等屏幕页面头部优化 */
  .page-header {
    min-height: 160px !important;
    padding: 60px 0 35px !important;
  }
  
  /* 中等屏幕企业文化优化 */
  .ci-stage {
    height: 240px !important;
  }
  
  .ci-tt {
    width: min(75%, 450px) !important;
  }
  
  /* 中等屏幕荣誉证书优化 */
  .honors-grid {
    gap: 18px !important;
  }
  
  .honor-item {
    padding: 12px !important;
  }
  
  .honor-item img {
    max-height: 180px !important;
  }
  
  /* 中等屏幕企业风采优化 */
  .style-gallery {
    gap: 18px !important;
  }
  
  .gallery-item img {
    height: 160px !important;
  }
  
  .gallery-caption {
    padding: 12px !important;
  }
  
  .gallery-caption h4 {
    font-size: 15px !important;
  }
  
  /* 标语图片更小一些 */
  .hero-slogans {
    right: 4% !important;
    top: 48% !important;
    gap: 8px !important;
  }
  
  .hero-slogans img {
    height: 32px !important;
  }
  
  /* 导航按钮小一些 */
  .prev-nav, .next-nav {
    width: 42px !important;
    height: 42px !important;
    font-size: 18px !important;
  }
  
  /* 确保导航层级高于任何轮播/遮罩/产品详情 */
  .carousel-wrapper, .hero-slider, .page-header, .product-detail, .product-tabs, .related-products { 
    position: relative; 
    z-index: 1; 
  }
  
  /* 在小屏幕上减少右边距 */
  .header .container { 
    margin-right: 20px !important; 
    max-width: calc(100% - 20px) !important; 
  }
}

@media (max-width: 480px) {
  /* 超小屏幕轮播图优化 */
  .hero-slider { height: 320px !important; }
  .hero-slider .slide { height: 320px !important; }
  
  /* 小屏幕页面头部优化 */
  .page-header {
    min-height: 140px !important;
    padding: 50px 0 25px !important;
  }
  
  /* 小屏幕企业文化优化 */
  .ci-stage {
    height: 200px !important;
  }
  
  .ci-tt {
    width: min(80%, 400px) !important;
    left: 15px !important;
    top: 15px !important;
  }
  
  /* 小屏幕荣誉证书优化 */
  .honors-grid {
    gap: 15px !important;
  }
  
  .honor-item {
    padding: 10px !important;
  }
  
  .honor-item img {
    max-height: 160px !important;
  }
  
  /* 小屏幕企业风采优化 */
  .style-gallery {
    gap: 15px !important;
  }
  
  .gallery-item img {
    height: 140px !important;
  }
  
  .gallery-caption {
    padding: 10px !important;
  }
  
  .gallery-caption h4 {
    font-size: 14px !important;
  }
  
  /* 标语图片最小 */
  .hero-slogans {
    right: 3% !important;
    top: 50% !important;
    gap: 6px !important;
  }
  
  .hero-slogans img {
    height: 26px !important;
  }
  
  /* 导航按钮最小 */
  .prev-nav, .next-nav {
    width: 36px !important;
    height: 36px !important;
    font-size: 16px !important;
  }
  
  /* 分页指示器小屏幕调整 */
  .slider-pagination {
    padding: 4px 8px !important;
    font-size: 12px !important;
    bottom: 8px !important;
    right: 15px !important;
  }
  
  /* 小屏幕下也覆盖原样式中的字体大小 */
  .slider-pagination .current-slide,
  .slider-pagination .separator,
  .slider-pagination .total-slides {
    font-size: 12px !important;
  }
}

/* 内容区域移动端布局优化 */
@media (max-width: 992px) {
  /* 通用区域间距优化 */
  .product-center, .about-us, .company-stats, .technical-advantages, .news-center {
    padding: 50px 0 !important;
  }
  
  /* 区域标题优化 - 调整字体大小 */
  .section-header {
    margin-bottom: 30px !important;
    text-align: center;
  }
  
  .section-header h2 {
    font-size: 18px !important;
    margin-bottom: 8px !important;
  }
  
  .section-header p {
    font-size: 13px !important;
    opacity: 0.8;
    letter-spacing: 1.5px;
  }
  
  /* 关于我们区域优化 */
  .about-content { 
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
    align-items: center;
  }
  
  .about-text {
    text-align: center !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
  
  .about-text p {
    font-size: 15px !important;
    line-height: 1.7 !important;
    margin-bottom: 15px !important;
    text-align: justify;
  }
  
  .about-image { 
    max-width: 90% !important; 
    margin: 0 auto !important;
    display: flex;
    justify-content: center;
  }
  
  .about-image img {
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
    transition: transform 0.3s ease;
  }
  
  .about-image img:hover {
    transform: scale(1.02);
  }
  
  /* 更多按钮优化 */
  .more-btn {
    display: inline-block !important;
    padding: 12px 30px !important;
    background: linear-gradient(135deg, #83913d 0%, #9ba548 100%) !important;
    color: white !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    margin-top: 20px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(131, 145, 61, 0.3);
  }
  
  .more-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(131, 145, 61, 0.4) !important;
  }
}

/* 产品中心移动端优化 - 简约版本 */
@media (max-width: 992px) {
  /* 产品网格 - 确保每行两个产品 */
  .product-grid,
  #productGrid,
  .products .product-grid,
  section .product-grid,
  .container .product-grid { 
    grid-template-columns: repeat(2, 1fr) !important; 
    gap: 18px !important; 
    display: grid !important;
  }
  
  /* 产品导航 - 简约设计 */
  .product-nav {
    margin-bottom: 35px !important;
  }
  
  .product-nav-container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 12px !important;
  }
  
  .product-nav-item {
    padding: 10px 18px !important;
    background: #f8f9fa !important;
    color: #666 !important;
    border-radius: 25px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    border: none;
    font-size: 14px !important;
  }
  
  .product-nav-item:hover {
    background: #83913d !important;
    color: white !important;
  }
  
  .nav-separator {
    display: none !important;
  }
}

@media (max-width: 768px) {
  /* 产品网格 - 简约版本 - 每行两个产品 */
  .product-grid,
  #productGrid,
  .products .product-grid { 
    grid-template-columns: repeat(2, 1fr) !important; 
    gap: 15px !important; 
    display: grid !important;
  }
  
  .product-item {
    border-radius: 12px !important;
    overflow: hidden !important;
    background: white !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(0,0,0,0.05);
  }
  
  .product-item:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.12) !important;
  }
  
  .product-info {
    padding: 12px !important;
  }
  
  .product-info h4 {
    font-size: 14px !important;
    margin-bottom: 6px !important;
    line-height: 1.3 !important;
    color: #333 !important;
  }
  
  .product-info p {
    font-size: 12px !important;
    color: #666 !important;
  }
}

@media (max-width: 480px) {
  /* 超小屏幕产品网格 - 强制保持每行两个产品 */
  .product-grid,
  #productGrid,
  .products .product-grid,
  section .product-grid,
  .container .product-grid { 
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    display: grid !important;
  }
  
  .product-item {
    margin: 0 3px !important;
  }
}

/* 企业数据统计区域 - 每行两个美观设计 */
@media (max-width: 992px) {
  .company-stats {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 50px 0 !important;
    border-top: 1px solid rgba(0,0,0,0.05);
    border-bottom: 1px solid rgba(0,0,0,0.05);
  }
  
  .stats-grid,
  .company-stats .stats-grid,
  section .stats-grid,
  .container .stats-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    max-width: 800px;
    margin: 0 auto;
  }
  
  .stat-item {
    text-align: center;
    padding: 25px 20px;
    background: transparent;
    border-radius: 16px;
    box-shadow: none;
    transition: all 0.3s ease;
    border: none;
    position: relative;
    overflow: hidden;
  }
  
  .stat-item:before {
    display: none;
  }
  
  .stat-item:hover {
    transform: translateY(-3px);
    box-shadow: none;
  }
  
  .stat-number {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: #83913d !important;
    margin-bottom: 8px !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.1);
  }
  
  .stat-label {
    font-size: 14px !important;
    color: #555 !important;
    margin-bottom: 4px !important;
    font-weight: 500;
    letter-spacing: 0.5px;
  }
  
  .stat-unit {
    font-size: 12px !important;
    color: #83913d !important;
    font-weight: 600 !important;
    opacity: 0.8;
  }
}

@media (max-width: 768px) {
  /* 中等屏幕优化 - 保持每行两个 */
  .stats-grid,
  .company-stats .stats-grid,
  section .stats-grid,
  .container .stats-grid {
    gap: 18px !important;
    max-width: 600px;
    grid-template-columns: repeat(2, 1fr) !important;
  }
  
  .stat-item {
    padding: 22px 15px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }
  
  .stat-number {
    font-size: 28px !important;
  }
  
  .stat-label {
    font-size: 13px !important;
  }
  
  .stat-unit {
    font-size: 11px !important;
  }
}

@media (max-width: 480px) {
  /* 小屏幕下也保持每行两个统计项 */
  .stats-grid,
  .company-stats .stats-grid,
  section .stats-grid,
  .container .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 15px !important;
    padding: 0 10px;
  }
  
  .stat-item {
    padding: 18px 12px !important;
    border-radius: 12px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }
  
  .stat-number {
    font-size: 26px !important;
    margin-bottom: 6px !important;
  }
  
  .stat-label {
    font-size: 12px !important;
    margin-bottom: 3px !important;
  }
  
  .stat-unit {
    font-size: 10px !important;
  }
}

/* 技术优势区域移动端优化 */
@media (max-width: 992px) {
  .technical-advantages {
    background: #f8f9fa;
  }
  
  /* 技术优势轮播图移动端调整 */
  .advx-wrapper {
    margin: 0 15px 30px !important;
    border-radius: 20px !important;
  }
  
  .advx-content {
    padding: 25px !important;
    flex-direction: column !important;
    gap: 25px !important;
  }
  
  .advx-media {
    min-height: 260px !important;
    height: 260px !important;
    border-radius: 15px !important;
    overflow: hidden;
    position: relative;
  }
  
  /* 轮播容器尺寸修复 */
  .advx-carousel {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    height: 100% !important;
  }
  
  .advx-track {
    display: flex !important;
    height: 100% !important;
    width: 100% !important;
    transition: transform 0.5s ease !important;
  }
  
  /* 技术优势轮播图片完全覆盖修复 */
  .advx-slide {
    min-width: 100% !important;
    height: 100% !important;
    position: relative !important;
  }
  
  .advx-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 100% !important;
    min-height: 100% !important;
  }
  
  .advx-text {
    padding: 0 !important;
    text-align: center;
  }
  
  .advx-eyebrow {
    font-size: 24px !important;
    padding-top: 15px !important;
    color: #83913d !important;
  }
  
  .advx-title {
    font-size: 18px !important;
    margin-bottom: 15px !important;
    line-height: 1.4;
  }
  
  .advx-lead {
    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: justify;
  }
  
  /* 轮播控制按钮移动端优化 */
  .advx-btn {
    width: 40px !important;
    height: 40px !important;
    font-size: 18px !important;
  }
  
  .advx-dots {
    bottom: 15px !important;
  }
  
  .advx-dot {
    width: 10px !important;
    height: 10px !important;
  }
}

@media (max-width: 768px) {
  /* 中等屏幕技术优势轮播优化 */
  .advx-media {
    min-height: 220px !important;
    height: 220px !important;
  }
}

@media (max-width: 480px) {
  /* 小屏幕技术优势轮播优化 */
  .advx-media {
    min-height: 180px !important;
    height: 180px !important;
  }
  
  .advx-content {
    padding: 20px !important;
    gap: 20px !important;
  }
}

/* 新闻中心移动端优化 - 简约版本 */
@media (max-width: 992px) {
  /* 新闻标签 - 简约设计 */
  .news-tabs {
    margin-bottom: 25px !important;
  }
  
  .news-tabs ul {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  
  .news-tabs li {
    flex: none !important;
  }
  
  .news-tabs li a {
    padding: 8px 16px !important;
    border-radius: 20px !important;
    background: #f5f5f5 !important;
    color: #666 !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    border: none;
    font-size: 14px !important;
  }
  
  .news-tabs li.active a,
  .news-tabs li a:hover {
    background: #83913d !important;
    color: white !important;
  }
  
  /* 新闻网格 - 简约设计 */
  .news-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
  }
  
  .news-item {
    border-radius: 12px !important;
    overflow: hidden !important;
    background: white !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(0,0,0,0.05);
  }
  
  .news-item:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.12) !important;
  }
  
  /* 查看更多按钮优化 */
  .view-more-btn {
    display: inline-block !important;
    padding: 15px 35px !important;
    background: linear-gradient(135deg, #83913d 0%, #9ba548 100%) !important;
    color: white !important;
    border-radius: 30px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(131, 145, 61, 0.3);
  }
  
  .view-more-btn:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(131, 145, 61, 0.4) !important;
  }
  
  .view-more-container {
    text-align: center !important;
    margin-top: 40px !important;
  }
}

@media (max-width: 768px) {
  /* 新闻项内容优化 */
  .news-content {
    padding: 20px !important;
  }
  
  .news-content h4 {
    font-size: 16px !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
  }
  
  .news-content p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 15px !important;
  }
  
  .read-more {
    font-size: 13px !important;
    color: #83913d !important;
    font-weight: 600 !important;
  }
}

/* 页脚移动端优化 - 现代美观设计 */
@media (max-width: 992px) {
  /* 页脚动画关键帧 */
  @keyframes footerFadeIn {
    0% {
      opacity: 0;
      transform: translateY(30px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes contactSlideIn {
    0% {
      opacity: 0;
      transform: translateX(-30px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  @keyframes navGroupSlideIn {
    0% {
      opacity: 0;
      transform: translateY(20px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes contactPulse {
    0%, 100% {
      box-shadow: 0 0 8px rgba(131, 145, 61, 0.3);
    }
    50% {
      box-shadow: 0 0 15px rgba(131, 145, 61, 0.5);
    }
  }
  
  @keyframes navGroupGlow {
    0%, 100% {
      box-shadow: 0 2px 8px rgba(131, 145, 61, 0.3);
    }
    50% {
      box-shadow: 0 4px 15px rgba(131, 145, 61, 0.4);
    }
  }
  
  .footer {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: #ffffff;
    position: relative;
    overflow: hidden;
    animation: footerFadeIn 0.8s ease-out;
  }
  
  /* 背景装饰效果 */
  .footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="rgba(255,255,255,0.03)"/><circle cx="75" cy="75" r="1" fill="rgba(255,255,255,0.03)"/><circle cx="50" cy="10" r="0.5" fill="rgba(255,255,255,0.02)"/><circle cx="10" cy="60" r="0.5" fill="rgba(255,255,255,0.02)"/><circle cx="90" cy="40" r="0.5" fill="rgba(255,255,255,0.02)"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    pointer-events: none;
  }
  
  .footer-main {
    padding: 40px 0 30px !important;
    position: relative;
    z-index: 1;
  }
  
  .footer-content { 
    display: flex !important; 
    flex-direction: column !important; 
    gap: 30px !important;
  }
  
  /* 联系信息区域 - 现代卡片设计 */
  .footer-contact {
    width: 100% !important;
    order: 1;
    animation: contactSlideIn 0.6s ease-out 0.2s both;
  }
  
  .contact-info h4 {
    font-size: 40px !important;
    color: #ffffff !important;
    margin-bottom: 20px !important;
    text-align: center !important;
    font-weight: 600;
    position: relative;
    padding-bottom: 0;
    width: 100% !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  .contact-info h4::after {
    display: none !important;
  }
  
  .contact-details {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }
  
  .contact-details p {
    font-size: 14px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    line-height: 1.6;
    margin: 0;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
  }
  
  .contact-details p::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(180deg, #83913d, #9ba548);
    border-radius: 0 2px 2px 0;
    box-shadow: 0 0 8px rgba(131, 145, 61, 0.3);
    animation: contactPulse 3s ease-in-out infinite;
  }
  
  .contact-details p:hover {
    background: rgba(255, 255, 255, 0.12);
    transform: translateX(5px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  }
  
  .contact-details strong {
    color: #83913d !important;
    font-weight: 600;
    margin-right: 8px;
  }
  
  /* 导航链接区域 - 现代分组设计 */
  .footer-navigation {
    width: 100% !important;
    order: 2;
    animation: navGroupSlideIn 0.6s ease-out 0.4s both;
  }
  
  .nav-groups {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 20px !important;
  }
  
  .nav-group {
    background: rgba(255, 255, 255, 0.08);
    border-radius: 15px;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    animation: navGroupSlideIn 0.6s ease-out both;
  }
  
  .nav-group:nth-child(1) { animation-delay: 0.5s; }
  .nav-group:nth-child(2) { animation-delay: 0.6s; }
  .nav-group:nth-child(3) { animation-delay: 0.7s; }
  
  .nav-group::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #83913d, #9ba548);
    border-radius: 15px 15px 0 0;
    box-shadow: 0 2px 8px rgba(131, 145, 61, 0.3);
    animation: navGroupGlow 4s ease-in-out infinite;
  }
  
  .nav-group:hover {
    background: rgba(255, 255, 255, 0.12);
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  }
  
  .nav-group h5 {
    font-size: 16px !important;
    color: #ffffff !important;
    margin-bottom: 15px !important;
    text-align: center;
    font-weight: 600;
    position: relative;
  }
  
  .nav-group h5::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 2px;
    background: #83913d;
    border-radius: 1px;
  }
  
  .nav-group ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  
  .nav-group ul li a {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 14px !important;
    padding: 8px 12px;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: block;
    text-align: left;
    position: relative;
    overflow: hidden;
  }
  
  .nav-group ul li a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: linear-gradient(90deg, rgba(131, 145, 61, 0.2), transparent);
    transition: width 0.3s ease;
  }
  
  .nav-group ul li a:hover {
    color: #ffffff !important;
    background: rgba(131, 145, 61, 0.15);
    transform: translateX(5px);
  }
  
  .nav-group ul li a:hover::before {
    width: 100%;
  }
  
  /* 页脚底部 - 现代设计 */
  .footer-bottom {
    background: rgba(0, 0, 0, 0.3) !important;
    padding: 20px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    z-index: 1;
  }
  
  .footer-bottom p {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 14px !important;
    text-align: center;
    margin: 0;
    font-weight: 400;
  }
  
  /* 触摸反馈优化 */
  .contact-details p,
  .nav-group,
  .nav-group ul li a {
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.2);
    tap-highlight-color: rgba(131, 145, 61, 0.2);
  }
  
  /* 焦点状态优化 */
  .nav-group ul li a:focus,
  .contact-details p:focus,
  .back-to-top:focus {
    outline: 2px solid #83913d;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(131, 145, 61, 0.2);
  }
  
  /* 高对比度模式支持 */
  @media (prefers-contrast: high) {
    .footer {
      background: #000000;
      border-top: 2px solid #ffffff;
    }
    
    .contact-details p,
    .nav-group {
      border: 2px solid #ffffff;
      background: #000000;
    }
    
    .nav-group ul li a {
      color: #ffffff !important;
    }
  }
  
  /* 减少动画偏好 */
  @media (prefers-reduced-motion: reduce) {
    .footer,
    .contact-details p::before,
    .nav-group::before,
    .back-to-top {
      animation: none !important;
      transition: none !important;
    }
    
    .contact-details p:hover,
    .nav-group:hover,
    .nav-group ul li a:hover {
      transform: none !important;
    }
  }
  
  /* 滚动性能优化 */
  .footer {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }
  
  /* 确保在低端设备上的性能 */
  .footer::before {
    will-change: auto;
  }
  
  .nav-group,
  .contact-details p {
    will-change: transform;
  }
  
  /* 企业文化页面优化 */
  .ci-interactive {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 20px 0 40px !important;
  }
  
  .ci-stage {
    height: 280px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
  }
  
  .ci-slide {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  
  .ci-slide.active {
    opacity: 1 !important;
    transform: scale(1) !important;
    z-index: 2 !important;
  }
  
  .ci-bg {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 100% !important;
    min-height: 100% !important;
    filter: brightness(1.05) contrast(1.02) !important;
  }
  
  .ci-tt {
    position: absolute !important;
    left: 20px !important;
    top: 20px !important;
    width: min(70%, 500px) !important;
    height: auto !important;
    z-index: 3 !important;
  }
  
  /* 荣誉证书页面优化 - 每行两个图片 */
  .honors-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
  
  .honor-item {
    background-color: #fff !important;
    padding: 15px !important;
    border-radius: 10px !important;
    text-align: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    transition: all 0.3s ease !important;
  }
  
  .honor-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15) !important;
  }
  
  .honor-item img {
    width: 100% !important;
    height: auto !important;
    max-height: 200px !important;
    object-fit: contain !important;
    border-radius: 6px !important;
    transition: transform 0.3s ease !important;
  }
  
  .honor-item img:hover {
    transform: scale(1.05) !important;
  }
  
  /* 企业风采页面优化 - 每行两个图片 */
  .style-gallery {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    margin-top: 30px !important;
  }
  
  .gallery-item {
    background: #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    cursor: pointer !important;
  }
  
  .gallery-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
  }
  
  .gallery-item img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
  }
  
  .gallery-item:hover img {
    transform: scale(1.05) !important;
  }
  
  .gallery-caption {
    padding: 15px !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
    position: relative !important;
  }
  
  .gallery-caption::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #83913d, #9ba548, #83913d) !important;
    background-size: 200% 100% !important;
    animation: shimmer 2s infinite !important;
  }
  
  .gallery-caption h4 {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin-bottom: 8px !important;
    position: relative !important;
  }
  
  .gallery-caption p {
    color: #666 !important;
    line-height: 1.5 !important;
    font-size: 13px !important;
    margin: 0 !important;
  }
  
  /* 返回顶部按钮 */
  .back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #83913d, #9ba548);
    border: none;
    border-radius: 50%;
    color: white;
    font-size: 20px;
    cursor: pointer;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(131, 145, 61, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  
  .back-to-top:hover {
    background: linear-gradient(135deg, #9ba548, #83913d);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(131, 145, 61, 0.4);
  }
  
  .back-to-top:active {
    transform: translateY(-1px);
  }
  
  /* 返回顶部按钮图标 */
  .back-to-top::before {
    content: '↑';
    font-weight: bold;
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .footer-main {
    padding: 35px 0 25px !important;
  }
  
  .contact-info h4 {
    font-size: 32px !important;
    text-align: center !important;
    width: 100% !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  /* 中等屏幕动画优化 */
  .contact-details p::before {
    animation: contactPulse 4s ease-in-out infinite;
  }
  
  .nav-group::before {
    animation: navGroupGlow 5s ease-in-out infinite;
  }
  
  .contact-details {
    gap: 10px;
  }
  
  .contact-details p {
    font-size: 13px !important;
    padding: 10px 14px;
  }
  
  .nav-groups {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
  }
  
  .nav-group {
    padding: 18px;
  }
  
  .nav-group h5 {
    font-size: 15px !important;
  }
  
  .nav-group ul li a {
    font-size: 13px !important;
    padding: 7px 12px;
  }
  
  .footer-bottom {
    padding: 18px 0 !important;
  }
  
  .footer-bottom p {
    font-size: 13px !important;
  }
}

@media (max-width: 480px) {
  .footer-main {
    padding: 30px 0 20px !important;
  }
  
  .contact-info h4 {
    font-size: 28px !important;
    margin-bottom: 15px !important;
    text-align: center !important;
    width: 100% !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  
  .contact-info h4::after {
    display: none !important;
  }
  
  .contact-details {
    gap: 8px;
  }
  
  .contact-details p {
    font-size: 12px !important;
    padding: 8px 12px;
    border-radius: 8px;
  }
  
  .contact-details p::before {
    width: 2px;
  }
  
  .nav-groups {
    gap: 12px !important;
  }
  
  .nav-group {
    padding: 15px;
    border-radius: 12px;
  }
  
  .nav-group::before {
    height: 2px;
  }
  
  .nav-group h5 {
    font-size: 14px !important;
    margin-bottom: 12px !important;
  }
  
  .nav-group h5::after {
    width: 15px;
    height: 2px;
  }
  
  .nav-group ul {
    gap: 6px;
  }
  
  .nav-group ul li a {
    font-size: 12px !important;
    padding: 6px 10px;
    border-radius: 6px;
  }
  
  .footer-bottom {
    padding: 15px 0 !important;
  }
  
  .footer-bottom p {
    font-size: 12px !important;
  }
  
  /* 小屏幕动画优化 */
  .contact-details p::before {
    animation: contactPulse 5s ease-in-out infinite;
  }
  
  .nav-group::before {
    animation: navGroupGlow 6s ease-in-out infinite;
  }
  
  /* 小屏幕返回顶部按钮优化 */
  .back-to-top {
    width: 45px;
    height: 45px;
    bottom: 15px;
    right: 15px;
    font-size: 16px;
  }
  
  .back-to-top::before {
    font-size: 16px;
  }
}

/* 移动端字体大小和间距优化 */
@media (max-width: 992px) {
  /* 基础字体设置 */
  body {
    font-size: 16px;
    line-height: 1.6;
  }
  
  /* 标题层次优化 - 调整字体大小 */
  h1 { font-size: 28px !important; line-height: 1.3 !important; margin-bottom: 15px !important; }
  h2 { font-size: 24px !important; line-height: 1.3 !important; margin-bottom: 12px !important; }
  h3 { font-size: 20px !important; line-height: 1.4 !important; margin-bottom: 10px !important; }
  h4 { font-size: 18px !important; line-height: 1.4 !important; margin-bottom: 8px !important; }
  h5 { font-size: 16px !important; line-height: 1.4 !important; margin-bottom: 6px !important; }
  h6 { font-size: 15px !important; line-height: 1.4 !important; margin-bottom: 5px !important; }
  
  /* 段落文本优化 */
  p { 
    font-size: 15px !important; 
    line-height: 1.6 !important; 
    margin-bottom: 15px !important;
    color: #444 !important;
  }
  
  /* 链接样式优化 */
  a {
    color: #83913d !important;
    transition: all 0.3s ease;
  }
  
  a:hover {
    color: #9ba548 !important;
  }
  
  /* 通用间距优化 */
  .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  
  /* 区域间距统一 */
  section {
    padding: 50px 0 !important;
  }
  
  /* 图片自适应 */
  img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px;
  }
  
  /* 触摸友好的按钮和交互元素 */
  button, .btn, input[type="submit"], input[type="button"], .product-nav-item {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 12px 20px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    cursor: pointer;
    transition: all 0.2s ease !important;
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.2);
    tap-highlight-color: rgba(131, 145, 61, 0.2);
    touch-action: manipulation;
  }
  
  /* 按钮触摸反馈 */
  button:active, .btn:active, input[type="submit"]:active, input[type="button"]:active {
    transform: scale(0.98);
    background-color: rgba(131, 145, 61, 0.1);
  }
  
  /* 表单元素优化 */
  input, textarea, select {
    min-height: 44px !important;
    padding: 12px 16px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    border: 2px solid #e0e0e0 !important;
    transition: all 0.3s ease !important;
    -webkit-appearance: none;
    appearance: none;
  }
  
  input:focus, textarea:focus, select:focus {
    border-color: #83913d !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(131, 145, 61, 0.1) !important;
  }
  
  /* 链接触摸区域优化 */
  .nav a, .footer a, .product-item a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.2);
    tap-highlight-color: rgba(131, 145, 61, 0.2);
  }
}

@media (max-width: 768px) {
  /* 小屏幕字体进一步优化 */
  h1 { font-size: 24px !important; }
  h2 { font-size: 20px !important; }
  h3 { font-size: 18px !important; }
  h4 { font-size: 16px !important; }
  h5 { font-size: 15px !important; }
  h6 { font-size: 14px !important; }
  
  p { font-size: 14px !important; line-height: 1.6 !important; }
  
  .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  section {
    padding: 40px 0 !important;
  }
}

@media (max-width: 480px) {
  /* 超小屏幕字体最终优化 */
  h1 { font-size: 20px !important; }
  h2 { font-size: 18px !important; }
  h3 { font-size: 16px !important; }
  h4 { font-size: 15px !important; }
  h5 { font-size: 14px !important; }
  h6 { font-size: 13px !important; }
  
  p { font-size: 13px !important; }
  
  .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  
  section {
    padding: 35px 0 !important;
  }
}

/* 其它杂项修复：避免负边距、过宽元素溢出 */
@media (max-width: 992px) {
  .logo { margin-right: auto !important; }
  .section-header { margin-bottom: 28px !important; }
  .product-info h4, .product-info p { width: 100% !important; }
  
  /* 防止水平滚动 */
  body, html {
    overflow-x: hidden !important;
  }
  
  /* 确保所有容器不会溢出 */
  * {
    max-width: 100%;
  }
}

/* 移动端内容区通用修复：避免大图溢出屏幕 */
@media (max-width: 992px) {
  .content-section img,
  .company-intro-image img,
  .about-image img,
  .news-image img,
  .product-detail .main-image img,
  .page-header img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* 内联设置了固定宽高的图片容器尽量自适应 */
  .company-intro-image,
  .about-image,
  .main-image {
    width: 100% !important;
    height: auto !important;
  }
  
  /* 页面头部背景图片优化显示 */
  .page-header {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    min-height: 180px !important;
    padding: 70px 0 40px !important;
    position: relative;
    overflow: hidden;
    border-radius: 0 !important;
  }
  
  /* 添加渐变遮罩，让文字更清晰 */
  .page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.4) 100%);
    z-index: 1;
  }
  
  /* 确保内容在遮罩之上 */
  .page-header .container {
    position: relative;
    z-index: 2;
  }
}

/* 移动端用户体验优化 - 简约版本 */
@media (max-width: 992px) {
  /* 触摸友好的按钮尺寸 */
  .btn, .more-btn, .detail-btn, .read-more, .view-more-btn, .product-nav-item {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 20px !important;
  }
  
  /* 滚动行为优化 - 移除smooth效果，避免滚动动画 */
  html {
    scroll-behavior: auto;
  }
  
  /* 触摸反馈优化 */
  .nav a, .product-item, .news-item, .stat-item, .mobile-menu {
    -webkit-tap-highlight-color: rgba(131, 145, 61, 0.1);
    tap-highlight-color: rgba(131, 145, 61, 0.1);
  }
  
  /* 输入框和表单元素 - 简约样式 */
  input, textarea, select {
    font-size: 16px !important;
    padding: 10px !important;
    border-radius: 6px !important;
    border: 1px solid rgba(0,0,0,0.15) !important;
    transition: border-color 0.3s ease !important;
  }
  
  input:focus, textarea:focus, select:focus {
    border-color: #83913d !important;
    outline: none !important;
  }
}

/* 移动端性能和可用性优化 - 简约版本 */
@media (max-width: 992px) {
  /* 优化滚动性能 */
  .nav, .hero-slider {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }
  
  /* 确保可访问性 */
  .section-header h2 {
    color: #333 !important;
  }
  
  .section-header p {
    color: #666 !important;
  }
  
  /* 焦点状态 */
  a:focus, button:focus, input:focus, .mobile-menu:focus {
    outline: 2px solid #83913d !important;
    outline-offset: 2px !important;
  }
}

/* 导航栏滚动冻结规则 - 只在加载完成后生效 */
@media (max-width: 992px) {
  /* 只对已加载完成的导航栏应用滚动冻结 */
  .header.loaded.scrolled,
  .header.loaded.scrolling-down,
  .header.loaded.scrolling-up {
    position: fixed !important;
    top: 0 !important;
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    box-shadow: 0 2px 15px rgba(0,0,0,0.3) !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }
  
  /* 禁用已加载导航栏的所有滚动动画触发器 */
  .header.loaded, 
  .header.loaded.scrolled, 
  .header.loaded.scrolling-down, 
  .header.loaded.scrolling-up,
  .header.loaded *, 
  .header.loaded .container, 
  .header.loaded .logo, 
  .header.loaded .logo img, 
  .header.loaded .mobile-menu, 
  .header.loaded .mobile-menu span {
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
  }
  
  /* 已加载状态下的汉堡菜单保持垂直居中 */
  .header.loaded .mobile-menu {
    transform: translateY(-50%) !important;
    -webkit-transform: translateY(-50%) !important;
    transition: none !important;
    animation: none !important;
  }
  
  /* 强制覆盖已加载导航栏的任何JavaScript添加的样式 */
  .header.loaded[style*="transform"],
  .header.loaded[style*="transition"],
  .header.loaded[style*="animation"] {
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
  
  /* 禁用已加载导航栏从main.js添加的滚动效果 */
  .header.loaded[style] {
    position: fixed !important;
    top: 0 !important;
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
  
  /* 强制禁用已加载导航栏的滚动动画CSS */
  .header.loaded.scrolled {
    background: rgba(0, 0, 0, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    transition: none !important;
    transform: none !important;
    animation: none !important;
  }
}

/* 移动端菜单颜色覆盖 - 确保移动端显示白色而不影响PC端 */
@media (max-width: 768px) {
  .header.scrolled .dropdown-menu a { 
    color: #ffffff !important; 
  }
  .header.scrolled .dropdown-menu a:hover { 
    color: #83913d !important; 
  }
}
