.campany-size {
/* 	background: linear-gradient(135deg, #000000 60%, #00ff00 100% 0%); */
	color: white;
	padding: 60px 20px;
	display: flex;
	align-items: center;
}

.campany-size-container {

	margin: 0 auto;
 
}

/* Counter Section */
.counter-section {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 50px;
    margin-bottom: 60px;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease-out forwards;
}

.counter-item {

	backdrop-filter: blur(10px);
	border-radius: 20px;
 
	text-align: center;
	min-width: 150px;
	transition: all 0.3s ease;

}

.counter-item:hover {
	transform: translateY(-10px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
	border-color: rgba(255, 255, 255, 0.4);
}

.icon img { 
	height: 60px;
	margin-bottom: 20px; 
}

.count {
	font-size: 45px;
	font-weight: 800;
	color: #00ff00;
	margin-bottom: 10px;

}

.label {
	font-size: 1.1em;
	color: rgba(255, 255, 255, 0.8);
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* Main Content Section */
.campany-size-needToTransition {
	display: flex;
	gap: 40px;
	opacity: 0;
	transform: translateY(30px);
	animation: fadeInUp 0.8s ease-out 0.3s forwards;
}

/* Pricing Section */
.pricing-section {
    width: 50%;
	backdrop-filter: blur(10px);
	border-radius: 20px;
	padding: 40px;
	transition: all 0.3s ease;
}

.pricing-section:hover {
	background: rgba(255, 255, 255, 0.1);
	transform: translateY(-5px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.pricing-section h2 {
	font-size: 2.2em;
	margin-bottom: 20px;
	color: #fff;
	line-height: 1.3;
}

.pricing-section p {
	font-size: 1.1em;
	line-height: 1.8;
	color: rgba(255, 255, 255, 0.9);
	margin-bottom: 30px;
}

.contact-button {
	background: linear-gradient(45deg, #000000, #10ee0d);
	color: white;
	border: none;
	padding: 15px 30px;
	font-size: 1.1em;
	border-radius: 50px;
	cursor: pointer;
	transition: all 0.3s ease;
	font-weight: 600;
	box-shadow: 0 4px 15px rgba(0, 255, 0, 0.3);
}

.contact-button:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(0, 255, 0, 0.4);
	background: linear-gradient(45deg, #00ff00, #000000);
}

/* Features Section */
.features-section { 
}

.feature-item {
	background: rgb(44 62 44 / 25%);
	backdrop-filter: blur(10px);
	border-radius: 20px;
	padding: 35px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	transition: all 0.3s ease;
	flex: 1;
}

.feature-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.feature-header span {
	background: linear-gradient(45deg, #00c8ff, #007bff);
	color: white;
	padding: 8px 16px;
	border-radius: 30px;
	font-size: 0.9em;
	font-weight: 600;
	display: inline-block;
	margin-bottom: 15px;
}

.feature-header h3 {
	font-size: 1.8em;
	color: white;
	margin: 10px 0 20px 0;
}

.feature-item p {
	font-size: 1.1em;
	line-height: 1.8;
	color: rgba(255, 255, 255, 0.9);
	margin-bottom: 25px;
}

.feature-item ul {
	list-style: none;
	margin-bottom: 25px;
}

.feature-item li {
	color: rgba(255, 255, 255, 0.8);
	margin-bottom: 12px;
	padding-left: 25px;
	position: relative;
	font-size: 1.05em;
}

.feature-item li::before {
	content: "✓";
	color: #00c8ff;
	position: absolute;
	left: 0;
	font-weight: bold;
}

.view-more-button,
.customization-options-button {
    background: linear-gradient(45deg, #667eea, #764ba2);
	color: white;
	border: none;
	padding: 12px 25px;
	font-size: 1.05em;
	border-radius: 50px;
	cursor: pointer;
	transition: all 0.3s ease;
	font-weight: 600;
	width: 100%;
	box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
}

.customization-options-button {
	background: linear-gradient(45deg, #667eea, #764ba2);
	box-shadow: 0 4px 15px rgba(118, 75, 162, 0.3);
}

.view-more-button:hover,
.customization-options-button:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px  #00ff00;
}

/* Animations */
@keyframes fadeInUp {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}


  .application-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
  }

  .application-banner img {
    width: 100%;
    height: auto;
    display: block;
  }

.arabic-exclusive .qiaoxin8379 .more_btn{
    text-align: right;
}
.arabic-exclusive .qiaoxin8379 .more_btn>div {
    margin-right: 20px;
}

.qiaoxin8379 {
    width: 100%;
     margin-top:80px; 
    height: 658px;
    position: relative;
}

.qiaoxin8379 .backstage-blocksEditor-wrap .backstage-blocksEditor-wrap-text .backstage-widgetsettings-tools-zindex {
    top: 15px;
}

.qiaoxin8379 .pro {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.qiaoxin8379 .pro li {
    height: 155px;
    position: relative;

}

.qiaoxin8379 .pro li .linkw {
    position: absolute;
    top: 33%;
    width: 42px;
    height: 42px;
    z-index: 1;
    right: -90px;
}

.qiaoxin8379 .pro li:before {
    content: "";
    width: 1px;
    height: 70px;
    display: block;
    position: absolute;
    right: 489px;
    bottom: 42px;
    background: rgba(250, 250, 250, 0.5);
}

.arabic-exclusive .qiaoxin8379 .pro li:before {
    right: 130px
}

.qiaoxin8379 .pro li .list_hover {
    width: 0;
    height: 100%;
    background-color: #0a1c2f;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    display: block;
    transition: 600ms;
    -webkit-transition: 600ms;
    opacity: 0.85;
}

.qiaoxin8379 .pro li .list_box {
    width: 600px;
    position: absolute;
    top: 15px;
    right: 0;
    color: #fff;
    /* z-index: 2; */
    padding: 2% 0 0;
}

.arabic-exclusive .qiaoxin8379 .pro li .list_box {
    padding-right: 10px;
    display: flex;
    flex-direction: row-reverse;
}

.qiaoxin8379 .pro li .list_box:before {
    width: 1px;
    height: 42px;
    margin-top: 0;
    right: -70px;
}

.qiaoxin8379 .pro li .list_box:after {
    width: 42px;
    height: 1px;
    right: -120px;
}

.qiaoxin8379 .pro li .list_box:after,
.qiaoxin8379 .pro li .list_box:before {
    content: "";
    background: #fff;
    display: block;
    top: 54%;
    position: absolute;
    visibility: hidden;
    opacity: 0;
    transition: 300ms;
    -webkit-transition: 300ms;
}

.qiaoxin8379 .pro li .list_ico {
    width: 90px;
    height: 90px;
    display: block;
}

.qiaoxin8379 .pro li .list_ico img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qiaoxin8379 .pro li .list_text {
    padding: 3% 0 0 7%;
    position: absolute;
    left: 90px;
    top: 10px;
}

.arabic-exclusive .qiaoxin8379 .pro li .list_text {
    padding: 3% 7% 0 0;
    text-align: right;
    left: unset;
    right: 125px;
}

.qiaoxin8379 .pro li .l {
    float: left;
}

.qiaoxin8379 .pro li .list_text .list_hd {
    font-size: 18px;
    font-family: Arial;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
}

.qiaoxin8379 .pro li .list_text .list_bd {
    margin-top: 10px;
    font-size: 13px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.qiaoxin8379 .pro li:hover .list_hover {
    width: 118%;
}

.qiaoxin8379 .pro li:hover .list_box:before {
    margin-top: -21px;
}

.qiaoxin8379 .pro li:hover .list_box:after {
    right: -90px;
}

.qiaoxin8379 .pro li:hover .list_box:after,
.qiaoxin8379 .pro li:hover .list_box:before {
    transition: 300ms ease-in 600ms;
    -webkit-transition: 300ms ease-in 600ms;
    visibility: visible;
    opacity: 1;
}

.qiaoxin8379 .more_btn {
    display: block;
    height: 38px;
    line-height: 38px;
    background:rgb(131 255 0);
    color: #000;
    text-align: center;
    font-size: 14px;
    position: absolute;
    width: 50%;
    bottom: 0;
    left: 0;
}

.qiaoxin8379 .more_btn a {
    color: inherit;
}

/* index_solution */

.index_solution {
    margin-bottom: 80px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.solution {
    text-align: center;
    /* max-width: 1400px; */
    width: 100%;
    padding: 20px;
    margin-top: 50px;


}

.solution h2 {
	font-size: 62px;
    color: rgb(131 255 0);
    margin-bottom: 10px;
}

.solution>p {
    font-size: 18px; 
    color: #fff;
	margin-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
}
/* --- Gallery 和 Gallery-item 样式 --- */

  .gallery {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    box-sizing: border-box;
  }

  
  .flip-card-container {
    width: calc(25% - 20px);  
    aspect-ratio: 3 / 4;  
    min-width: 200px;  
    perspective: 1000px;
  }

  
  .flip-card {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  }

 
  .flip-card-container:hover .flip-card {
    transform: rotateY(180deg);
  }

 
  .flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: inherit;
  }

 
  .flip-card-front {
    background-color: #005500;  
    color: white;
    font-size: 24px;
    font-weight: bold;
  }

   
  .flip-card-back {
    background-color: #fff;
    transform: rotateY(180deg);
    overflow: hidden;
  }

  
  .flip-card-back img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }




/*application-module9*/
.application-module9-container {
    margin-top: 80px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    height: 100%;
    gap: 0;
  }

  .left, .right {
    display: flex;
    flex-direction: column;
  }

  .left-top, .right-bottom {
    flex: 1;
  }

  .left-bottom, .right-top {
    display: flex;
    flex: 1;
    width: 100%;
    height: 100%;
  }

  .left-bottom .image-container, .right-top .image-container {
    flex: 1;
    height: 100%;
  }

  .image-container {
    position: relative;
    overflow: hidden;
  }

  .image-container img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
  }

  /* 左上角覆盖层样式 */
  .image-container .overlay-top-left {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.1);
    transition: all 0.7s ease;
    transform-origin: top left;
    z-index: 2;
  }

  /* 右下角覆盖层样式 */
  .image-container .overlay-bottom-right {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    background: rgba(0, 0, 0, 0.1);
    transition: all 0.7s ease;
    transform-origin: bottom right;
    z-index: 2;
  }

  /* 悬停时触发两个覆盖层同时展开 */
  .image-container:hover .overlay-top-left,
  .image-container:hover .overlay-bottom-right {
    width: 100%;
    height: 100%;
  }

  /* --- 双点延伸边框动画 --- */
  .image-container::before, /* 左边框 */
  .image-container::after,  /* 上边框 */
  .image-container span::before, /* 右边框 */
  .image-container span::after {  /* 下边框 */
    content: '';
    position: absolute;
    background: #143141;
    transition: transform 0.7s ease;
    z-index: 3;
    transform: scaleX(0) scaleY(0); /* 初始状态：线条长度为0 */
  }

  /* 左边框 - 从上下两端向中间收缩 */
  .image-container::before {
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    transform-origin: top center; /* 默认从顶部收缩 */
  }
  .image-container:hover::before {
     transform-origin: bottom center; /* 悬停时改为从底部收缩 */
     transform: scaleY(1); /* 展开到完整高度 */
  }

  /* 上边框 - 从左右两端向中间收缩 */
  .image-container::after {
    top: 0;
    left: 0;
    height: 6px;
    width: 100%;
    transform-origin: left center; /* 默认从左侧收缩 */
  }
  .image-container:hover::after {
     transform-origin: right center; /* 悬停时改为从右侧收缩 */
     transform: scaleX(1); /* 展开到完整宽度 */
  }

  /* 添加一个span用于右边框和下边框 */
  .image-container span {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
  }

  /* 右边框 - 从上下两端向中间收缩 */
  .image-container span::before {
    top: 0;
    right: 0;
    width: 6px;
    height: 100%;
    transform-origin: top center; /* 默认从顶部收缩 */
  }
  .image-container:hover span::before {
     transform-origin: bottom center; /* 悬停时改为从底部收缩 */
     transform: scaleY(1); /* 展开到完整高度 */
  }

  /* 下边框 - 从左右两端向中间收缩 */
  .image-container span::after {
    bottom: 0;
    left: 0;
    height: 6px;
    width: 100%;
    transform-origin: left center; /* 默认从左侧收缩 */
  }
  .image-container:hover span::after {
     transform-origin: right center; /* 悬停时改为从右侧收缩 */
     transform: scaleX(1); /* 展开到完整宽度 */
  }
  
  
  /*application-module10*/
    .application-module10 {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #ffffff;
        }
        .application-module10-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
          
        }
       .application-module10-container h1 {
            text-align: center;
            color: #003366;
            margin-top: 50px;
           font-size: 37px;
        }
        .application-module10-container p {
			font-size: 18px;
            line-height: 1.6;
            margin-bottom: 20px;
            color: #333;
        }
       .application-module10 .image-container {
            margin: 40px 0;
        }
        .image-container img {
            max-width: 100%;
            height: auto;
        }
        .contact-icons {
            position: fixed;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
        }
        .contact-icons a {
            display: block;
            width: 50px;
            height: 50px;
            background-color: #003366;
            border-radius: 50%;
            margin-bottom: 10px;
            text-align: center;
            line-height: 50px;
            color: white;
            text-decoration: none;
        }
        .contact-icons i {
            font-size: 24px;
        }
        .button-container {
            text-align: center;
            margin: 30px 0 50px 0;
        }
        .explore-button {
            background-color: #003366;
            color: white;
            border: none;
            padding: 15px 30px;
            font-size: 18px;
            border-radius: 5px;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        .explore-button:hover {
            background-color: #0055a5;
        }
        
        			.company-news {
				background-color: #000;
				color: #fff;
				padding: 20px;
				margin: 0 auto; /* 居中 */
			}

			.news-header {
				text-align: center;
				margin-bottom: 30px;
			}

			.news-header h2 {
				color:#83ff00;
				font-size: 62px;
				font-weight: bold;
				letter-spacing: 2px;
			}

			.title-icon {
				/* 如果需要图标，可以在这里添加样式 */
				display: block;
				height: 3px;
				width: 80px;
				background-color: #83ff00;
				margin: 10px auto 0;
			}

			.news-content {
				/* 使用 Flexbox 布局 */
				display: flex;
				flex-wrap: wrap;
				justify-content: center; /* 在不够一行时也居中 */
				gap: 10px; /* 卡片间距 */
				margin-top: 80px;
			}

			/* 默认样式：每个卡片占满一行 (手机端) */
			.news-item {
				flex: 1 1 100%; /* 默认占满整行 */
				min-width: 220px; /* 最小宽度 */
			}

			figure.snip0018 {
				position: relative;
				overflow: hidden;
				width: 100%;
				max-width: 100%; /* 卡片最大宽度 */
				max-height: 100%;
				margin: 0 auto; /* 在容器内居中 */
				background: #000000;
				text-align: center;
			}

			figure.snip0018 * {
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
			}

			figure.snip0018 img {
				opacity: 1;
				width: 100%;
				height: 100%; /* 确保图片填满容器高度 */
				object-fit: cover; /* 保持比例裁剪 */
				-webkit-transition: opacity 0.35s;
				transition: opacity 0.35s;
			}

			figure.snip0018 figcaption {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 100%;
			}

			figure.snip0018 figcaption > div {
				height: 50%;
				overflow: hidden;
				width: 100%;
				position: relative;
			}

			figure.snip0018 figcaption::before {
				position: absolute;
				top: 50%;
				right: 50%;
				left: 50%;
				height: 2px;
				content: '';
				opacity: 0;
				background-color: rgba(255, 255, 255, 0);
				-webkit-transition: all 0.4s;
				transition: all 0.4s;
				-webkit-transition-delay: 0.6s;
				transition-delay: 0.6s;
			}

			figure.snip0018 h2,
			figure.snip0018 p {
				margin: 0;
				padding: 30px 35px;
				opacity: 0;
				position: absolute;
				height: 100%;
				width: 100%;
				left: 0;
				-webkit-transition: opacity 0.4s, -webkit-transform 0.4s;
				transition: opacity 0.4s, -webkit-transform 0.4s, -moz-transform 0.4s, -o-transform 0.4s, transform 0.4s;
			}

			figure.snip0018 h2 {
				display: inline-block;
				word-spacing: -0.1em;
				font-weight: 300;
				text-transform: uppercase;
				bottom: 0;
				background: rgba(0, 0, 0, 0.5);
				-webkit-transform: translate3d(0%, 50%, 0);
				transform: translate3d(0%, 50%, 0);
				-webkit-transition-delay: 0s;
				transition-delay: 0s;
				/* 确保文字在小屏幕上可读 */
				font-size: 1.2em;
			}

			figure.snip0018 h2 span {
				font-weight: 800;
			}

			figure.snip0018 p {
				font-weight: 300;
				top: 0%;
				color: #000;
				background: #fff;
				-webkit-transform: translate3d(0%, -50%, 0);
				transform: translate3d(0%, -50%, 0);
				-webkit-transition-delay: 0s;
				transition-delay: 0s;
				/* 确保文字在小屏幕上可读 */
				font-size: 1em;
			}

			figure.snip0018 a {
				left: 0;
				right: 0;
				top: 0;
				bottom: 0;
				position: absolute;
				color: #ffffff;
			}

			figure.snip0018:hover img {
				opacity: 0.7;
			}

			figure.snip0018:hover figcaption h2,
			figure.snip0018:hover figcaption p {
				-webkit-transform: translate3d(0%, 0%, 0);
				transform: translate3d(0%, 0%, 0);
				-webkit-transition-delay: 0.3s;
				transition-delay: 0.3s;
			}

			figure.snip0018:hover figcaption h2 {
				opacity: 1;
			}

			figure.snip0018:hover figcaption p {
				opacity: 1;
			}

			figure.snip0018:hover figcaption::before {
				background: #ffffff;
				left: 0px;
				right: 0px;
				opacity: 1;
				-webkit-transition-delay: 0s;
				transition-delay: 0s;
			}
.index_contact {
background-color: #000;
    margin: 0 auto;
    padding: 20px;
}

/* 顶部横幅区域 */
.top-section {
    margin-bottom: 30px;
}

.banner-section { 
    background-size: cover;
    background-position: center;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
}

.banner-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.banner-section > * {
    z-index: 2;
}

.banner-section h2 {
	color: rgb(131 255 0);
    font-size: 62px;
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

.banner-section p {
    font-size: 18px;
    margin-bottom: 25px;
    max-width: 600px;
}

.top-banner-button {
    display: inline-block;
    background: #47d03c;
    color: white;
    padding: 12px 30px;
    text-decoration: none;
    border-radius: 30px;
    font-weight: bold;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.top-banner-button:hover {
    background: transparent;
    border-color: white;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

/* 修改：将 contact-section 改为 flex 布局实现左右排列 */
.contact-section {
    display: flex;
    gap: 30px;
    /* 在小屏幕上改为垂直堆叠 */
    flex-wrap: wrap;
}

/* 丝材比较区域 - 设置为占据一半宽度 */
.filament-section {
    flex: 1;
    min-width: 300px;
}

.filament-content {
    background-image: url('https://images.unsplash.com/photo-1626785774573-4b69a0c1d28b?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80');
    background-size: cover;
    background-position: center;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
}

.filament-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgb(33 33 33 / 80%), rgb(2 2 2 / 70%));
    z-index: 1;
}

.filament-content > * {
    z-index: 2;
}

.filament-content h3 {
    font-size: 35px;
    margin-bottom: 12px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
}

.filament-content p {
    font-size: 18px;
    margin-bottom: 20px;
    max-width: 500px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}

.filament-button {
    display: inline-block;
    background: white;
    color: #087d29;
    padding: 10px 25px;
    text-decoration: none;
    border-radius: 25px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.filament-button:hover {
    background: #087d29;
    color: white;
    transform: scale(1.05);
}

.help-section {
    flex: 1;
    min-width: 300px;
    display: flex;
    background: linear-gradient(135deg, rgb(0 0 0 / 80%), rgb(114 133 112));
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.help-content {
    flex: 1;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.help-content h3 {
    font-size: 32px;
    color: #4caf50;
    margin-bottom: 15px;
}

.help-content p {
    font-size: 18px;
    margin-bottom: 25px;
    color: #555;
}

.help-button {
    display: inline-block;
    background: #4caf50;
    color: white;
    padding: 12px 28px;
    text-decoration: none;
    border-radius: 25px;
    font-weight: 600;
    align-self: flex-start;
    transition: all 0.3s ease;
}

.help-button:hover {
    color: white;
    background: #377e39;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 102, 204, 0.3);
}

.right-image {
    flex: 1;
    height: 400px;
    object-fit: cover;
    object-position: center;
}


/*  form */

 

/* 按钮样式 */
.subscribe_btn {
  margin-bottom: 20px;
}

.sys_btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, #303031 0%, #393939 100%);
  color: white;
  padding: 14px 32px;
  border-radius: 30px;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  box-shadow: 0 4px 15px rgba(68, 68, 68, 0.3);
  transition: all 0.3s ease;
  cursor: pointer;
}

.sys_btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(77, 77, 77, 0.4);
}

.btn_txt {
  font-size: 14px;
}
 

	/* 弹窗遮罩层 */
			.modal {
				display: none;
				position: fixed;
				z-index: 1000;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				overflow: auto;
				background-color: rgba(0, 0, 0, 0.5);
				animation: fadeIn 0.3s ease-in-out;
			}

			/* 弹窗内容区域 */
			.modal-content {
				background-color: #fff;
				margin: 5% auto;
				padding: 30px;
				border-radius: 10px;
				width: 90%;
				max-width: 700px;
				box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
				animation: slideIn 0.3s ease-out;
			}

			/* 关闭按钮 */
			.close {
				color: #aaa;
				float: right;
				font-size: 28px;
				font-weight: bold;
				line-height: 1;
				cursor: pointer;
				transition: color 0.3s;
			}

			.close:hover,
			.close:focus {
				color: #000;
				text-decoration: none;
			}

			/* 表单标题 */
			.modal-content h3 {
				text-align: center;
				margin-bottom: 20px;
				color: #333;
			}

			/* 表单行容器 - 用于两列布局 */
			.form-row {
				display: flex;
				gap: 20px;
				margin-bottom: 18px;
				flex-wrap: wrap;
				/* 移动端自适应 */
			}

			/* 表单组通用样式 */
			.form-group {
				flex: 1;
				min-width: 200px;
				/* 移动端最小宽度 */
			}

			.form-group label {
				display: block;
				margin-bottom: 6px;
				font-weight: bold;
				color: #333;
			}

			.form-group input[type="text"],
			.form-group input[type="email"],
			.form-group input[type="tel"],
			.form-group input[type="number"],
			.form-group select,
			.form-group textarea {
				width: 100%;
				padding: 10px;
				border: 1px solid #ccc;
				border-radius: 4px;
				font-size: 14px;
				box-sizing: border-box;
			}

			.form-group textarea {
				resize: vertical;
				min-height: 80px;
			}

			/* 复选框样式 */
			.checkbox-group {
				display: flex;
				align-items: center;
				margin: 18px 0;
			}

			.checkbox-group input[type="checkbox"] {
				margin-right: 8px;
				transform: scale(1.1);
			}

			.checkbox-group label {
				font-size: 14px;
				color: #555;
			}

			/* 按钮组 */
			.button-group {
				display: flex;
				justify-content: flex-end;
				gap: 12px;
				margin-top: 20px;
			}

			.cancel-btn,
			.submit-btn {
				padding: 10px 20px;
				border: none;
				border-radius: 4px;
				cursor: pointer;
				font-size: 14px;
				font-weight: bold;
			}

			.cancel-btn {
				background-color: #e7e7e7;
				color: #333;
			}

			.cancel-btn:hover {
				background-color: #ccc;
			}

			.submit-btn {
				background-color: #383a39;
				color: white;
			}

			.submit-btn:hover {
				background-color: #767676;
			}

			/* 全宽字段：独占一行 */
			.form-group.full-width {
				flex: 100%;
				margin-bottom: 18px;
			}

			/* 动画效果 */
			@keyframes fadeIn {
				from {
					opacity: 0;
				}

				to {
					opacity: 1;
				}
			}

			@keyframes slideIn {
				from {
					transform: translateY(-50px);
					opacity: 0;
				}

				to {
					transform: translateY(0);
					opacity: 1;
				}
			}

/* 响应式设计 */
@media (max-width: 992px) {
 	.gallery {
		grid-template-columns: repeat(2, 1fr);
	}
    .pricing-section{
        width: 100%;
    }
    .contact-section {
        flex-direction: column;
    }
    
    .help-section {
        flex-direction: column;
    }
    
    .right-image {
        height: 200px;
    }
     .flip-card-container {
      width: calc(33.333% - 20px); 
    }
}

@media (max-width: 768px) {
 	.gallery {
		grid-template-columns: 1fr;
	}
    .banner-section h2 {
        font-size: 28px;
    }
    
    .filament-content h3 {
        font-size: 24px;
    }
    .flip-card-container {
      width: calc(50% - 20px); 
    }
}

@media (max-width: 480px) {
    .banner-section h2 {
        font-size:24px;
    }
    
    .filament-content h3 {
        font-size: 20px;
    }
    
    .help-content {
        padding: 30px 20px;
    }
    .flip-card-container {
      width: 100%;  
    }
}

/* 按钮通用样式 */
a {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

a:hover {
    text-decoration: none;
}
  
  			@media (min-width: 1024px) {
				.news-item {
					flex: 1 1 calc(25% - 15px); /* 减去间距的一半 */
					max-width: calc(25% - 15px);
				}
			}
@media screen and (max-width:1200px) {
    .qiaoxin8379 .pro li:hover .list_hover {
        width: 100%;
    }

    .qiaoxin8379 .pro li .list_box {
        right: unset;
        left: 20px;
        /* left: 10px; */
    }

    .qiaoxin8379 .more_btn {
        width: 100%;
    }

    .qiaoxin8379 .pro li:before {
        left: 120px;
        right: unset;
    }

    .arabic-exclusive .qiaoxin8379 .pro li:before {
        left: 498px;
        right: unset;
    }

    .qiaoxin8379 .pro {
        width: 100%;
    }

    .qiaoxin8379 .pro li:hover .list_box:after,
    .qiaoxin8379 .pro li:hover .list_box:before {
        opacity: 1;
    }


    .qiaoxin8379 .pro li .list_box:before {
        right: -270px;
    }

    .qiaoxin8379 .pro li:hover .list_box:after {
        right: -290px;
    }

    .qiaoxin8379 .pro li .linkw {
        right: 107px;
    }
}

@media screen and (max-width:900px) {
    	.campany-size-needToTransition {
		flex-direction: row;
		align-items: flex-start;
	}

	.pricing-section,
	.features-section {
		flex: 1;
	}

	.features-section {
		display: flex;
		flex-direction: column;
	}

	.features-section {
		flex-direction: row;
		align-items: stretch;
		gap: 40px;
	}

	.feature-item {
		flex: 1;
		min-width: 0;
		/* 允许弹性收缩 */
	}
    .qiaoxin8379 .pro li:hover .list_box:after {
        right: -170px;
    }

    .qiaoxin8379 .pro li .list_box:before {
        right: -150px;
    }

    .qiaoxin8379 .pro li .linkw {
        right: 28px;
    }
    
}

@media screen and (max-width:768px) {
    .counter-section {
        flex-direction: column;
    }
   
 
    	.campany-size-needToTransition {
		flex-direction: column;
		align-items: flex-start;
	}

	.pricing-section,
	.features-section {
		flex: 1;
	}
 

	.features-section {
		flex-direction: column;
		align-items: stretch;
		gap: 40px;
	}

	.feature-item {
		flex: 1;
		min-width: 0;
		/* 允许弹性收缩 */
	}
    .qiaoxin8379 .pro li:hover .list_box:after {
        right: -130px;
    }

    .qiaoxin8379 .pro li .list_box:before {
        right: -110px;
    }
    .arabic-exclusive .qiaoxin8379 .pro li:hover .list_box:after{
        right: -65px
    }
    .arabic-exclusive .qiaoxin8379 .pro li .list_box:before{
        right: -45px;
    }
    .qiaoxin8379 .pro li .linkw {
        right: 103px;
    }
    .news-item {
	flex: 1 1 calc(50% - 10px); /* 减去间距的一半 */
		max-width: calc(50% - 10px);
				}
}

@media screen and (max-width: 650px) {
    .qiaoxin8379 .pro li .list_box {
        width: calc(100% - 40px);
        /* width: calc(100% - 20px); */
    }

    .arabic-exclusive .qiaoxin8379 .pro li:before {
        left: unset;
        right: 23%;
    }
}

@media screen and (max-width: 590px) {
    .arabic-exclusive .qiaoxin8379 .pro li:before {
        left: unset;
        right: 25%;
    }
}

@media screen and (max-width: 540px) {
    .arabic-exclusive .qiaoxin8379 .pro li:before {
        left: unset;
        right: 27%;
    }
}

@media screen and (max-width:510px) {
    .arabic-exclusive .qiaoxin8379 .pro li .list_text {
        top: -9px;
        padding: 3% 0 0 0;
        right: 100px;
    }

    /* .qiaoxin8379 .pro li .list_box {
        width: 338px;
    } */

    .qiaoxin8379 .pro li {
        height: 130px;
        /* padding: 10px 0; */
    }

    .qiaoxin8379 .pro li:before {
        left: 90px;
    }

    .qiaoxin8379 .fa {
        font-size: 60px ! important;
    }

    .qiaoxin8379 .pro li .list_ico {
        width: 60px;
        height: 60px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }


    .qiaoxin8379 .pro li {
        height: 110px;
    }

    .qiaoxin8379 .pro li:before {
        bottom: 18px;
    }

    .qiaoxin8379 {
        height: 478px;
    }

    .qiaoxin8379 .pro li:hover .list_box:after,
    .qiaoxin8379 .pro li:hover .list_box:before {
        opacity: 0;
    }

    .qiaoxin8379 .pro li .linkw {
        display: none;
    }

    .qiaoxin8379 .pro li .list_box:after,
    .qiaoxin8379 .pro li .list_box:before {
        display: none;
    }

    .qiaoxin8379 .pro li .list_box {
        width: calc(100% - 74px);
        position: relative;
        /* top: auto; */
        top: 50%;
        transform: translateY(-50%);
    }

    .arabic-exclusive .qiaoxin8379 .pro li .list_box {
        width: calc(100% - 20px);
        left: unset;

    }

    .arabic-exclusive .qiaoxin8379 .pro li:before {
        right: 100px;
    }

    .qiaoxin8379 .pro li .list_text {
        padding: 1% 0 0 7%;
        left: 36px;
        top: -4px;
        position: relative;
        right: initial;
        float: unset;
    }

    .qiaoxin8379 .pro li .list_text .list_bd {
        margin-left: 39px;
    }

    .arabic-exclusive .qiaoxin8379 .pro li .list_text .list_bd {
        width: 360px;
    }

    .qiaoxin8379 .pro li .list_text .list_hd {
        margin-left: 39px;
    }
}

@media screen and (max-width:380px) {
    .arabic-exclusive .qiaoxin8379 .pro li .list_text .list_bd {
        width: 244px;
    }
}

/* news */
 .module-news {
     display: flex;
     justify-content: space-between;
     width: 100%;
     max-width: 1200px;
     margin: auto;
     position: relative;
 }
 .left-image {
     width: 65%;
     position: relative;
 }
 .left-image img {
     width: 100%;
     height: auto;
     display: block;
 }
 .popup-card {
 height: 80%;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 background-color: rgb(0 24 42 / 86%);
 color: white;
 padding: 20px;
 border-radius: 10px;
 opacity: 0;
 visibility: hidden;
 transition: all 0.3s ease;
 width: 80%;
 text-align: center;
 align-items: center;
 }
 .left-image:hover .popup-card {
     opacity: 1;
     visibility: visible;
 }
 .right-images {
     width: 33%;
 }
 .image-item {
     position: relative;
     margin-bottom: 15px;
     border-radius: 10px;
     overflow: hidden;
 }
 .image-item img {
     width: 100%;
     height: 160px;
     display: block;
 }
 .image-text {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
     color: white;
     padding: 10px;
     text-align: left;
 }
 .image-text h3, .image-text p {
     margin: 0;
 }
 .module_footer {
   background-image: url('https://via.placeholder.com/1920x400/000/000?text=Background+Image');
   background-size: cover;
   background-position: center;
   padding: 60px 5% 30px;
   position: relative;
   color: white;
   min-height: 400px;
 }
 
 .module_footer::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.6);
   z-index: 1;
 }
 
 .footer-content {
   position: relative;
   z-index: 2;
   display: flex;
   justify-content: space-between;
   margin: 0 auto;
   gap: 80px;
 }
 
 .footer-left {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 20px;
 }
 
 .footer-left img {
   width: 200px;
   height: auto;
 }
 
 .footer-left p {
   font-size: 16px;
   line-height: 1.6;
   color: #fff;
 }
 
 .footer-center {
   flex: 1;
   text-align: center;
 }
 
 .footer-center h3 {
   font-size: 24px;
   margin-bottom: 20px;
 }
 
 .social-icons {
   display: flex;
   justify-content: center;
   gap: 15px;
 }
 
 .social-icons a {
	font-size: 20px;
   width: 40px;
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: rgba(255, 255, 255, 0.1);
   border-radius: 50%;
   transition: all 0.3s ease;
   color: white;
   text-decoration: none;
 }
 
 .social-icons a:hover {
   background-color: white;
   color: black;
 }
 
 .footer-right {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 10px;
 }
 
 .footer-right h3 {
   font-size: 24px;
   margin-bottom: 15px;
 }
 
 .footer-right ul {
   list-style: none;
 }
 
 .footer-right li {
   margin-bottom: 8px;
 }
 
 .footer-right a {
   color: white;
   text-decoration: none;
   transition: color 0.3s ease;
 }
 
 .footer-right a:hover {
   color: #00bfff;
 }
 
 .footer-bottom {
   margin-top: 40px;
   text-align: center;
   padding: 20px 0;
   border-top: 1px solid rgba(255, 255, 255, 0.2);
   color: #ccc;
   font-size: 14px;
 }
 
 .footer-bottom a {
   color: #ccc;
   text-decoration: none;
 }
 
 .footer-bottom a:hover {
   color: #fff;
 }