/* multi10 手机样式：≤1024 顶部与抽屉菜单，≤768 手机排版。PC 规则不写在这里 */

.m-drawer,
.m-mask,
.m-actionbar,
.m-cat-toggle {
	display: none;
}

/* ========== 抽屉菜单（≤1024px，平板和手机共用） ========== */
@media screen and (max-width: 1024px) {
	/* 原来的全屏下拉菜单不再使用 */
	.header .nav ul,
	.header .nav .quote-btn {
		display: none !important;
	}

	.header .nav .menus {
		width: 54px;
		height: 54px;
		background-size: 26px auto;
	}

	/* 语言按钮加大点击区域 */
	.header .nav .language {
		margin-right: 54px;
	}

	.header .nav .language p {
		height: 44px;
		padding: 0 6px;
	}

	/* 首页分类卡片：文字层盖住图片，手机平板上不显示（PC 悬停才出现） */
	.catep .items .ptxt {
		display: none;
	}

	.m-drawer {
		display: flex;
		flex-direction: column;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		width: 86vw;
		max-width: 360px;
		background: #fff;
		z-index: 1001;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .3s, visibility .3s;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		line-height: normal;
		text-align: left;
	}

	body.m-drawer-open .m-drawer {
		transform: none;
		visibility: visible;
	}

	.m-mask {
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0, 0, 0, .45);
		z-index: 1000;
		opacity: 0;
		pointer-events: none;
		transition: opacity .3s;
	}

	body.m-drawer-open .m-mask,
	body.m-sheet-open .m-mask {
		opacity: 1;
		pointer-events: auto;
	}

	body.m-drawer-open,
	body.m-sheet-open {
		overflow: hidden;
	}

	.m-drawer-head {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex: none;
		height: 54px;
		padding: 0 6px 0 16px;
		background: #006225;
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		letter-spacing: 1px;
	}

	.m-drawer-close {
		width: 44px;
		height: 44px;
		border: 0;
		background: none;
		color: #fff;
		font-size: 32px;
		line-height: 44px;
		cursor: pointer;
	}

	.m-drawer-list {
		flex: 1;
	}

	.m-drawer-row {
		display: flex;
		align-items: stretch;
		border-bottom: 1px solid #eee;
	}

	.m-drawer-row a {
		flex: 1;
		min-width: 0;
		display: block;
		padding: 13px 16px;
		font-size: 16px;
		line-height: 22px;
		color: #333;
		overflow-wrap: break-word;
	}

	.m-drawer-toggle {
		flex: none;
		position: relative;
		width: 48px;
		border: 0;
		border-left: 1px solid #eee;
		background: none;
		cursor: pointer;
	}

	.m-drawer-toggle::before {
		content: '';
		position: absolute;
		left: 50%;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 2px solid #006225;
		border-bottom: 2px solid #006225;
		transform: translate(-50%, -70%) rotate(45deg);
		transition: transform .2s;
	}

	.m-drawer-item.open > .m-drawer-row > .m-drawer-toggle::before {
		transform: translate(-50%, -30%) rotate(-135deg);
	}

	.m-drawer-sub {
		display: none;
		background: #f7f7f7;
	}

	.m-drawer-item.open > .m-drawer-sub {
		display: block;
	}

	.m-drawer-sub .m-drawer-row a {
		padding-left: 28px;
		font-size: 15px;
	}

	.m-drawer-sub .m-drawer-sub .m-drawer-row a {
		padding-left: 40px;
		font-size: 14px;
		color: #555;
	}

	.m-drawer-lang {
		display: flex;
		flex-wrap: wrap;
		flex: none;
		padding: 8px 10px;
		border-bottom: 1px solid #eee;
	}

	.m-drawer-lang a {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 0 8px;
		font-size: 14px;
		color: #333;
	}

	.m-drawer-lang a.on {
		color: #006225;
		font-weight: bold;
	}

	.m-drawer-lang img {
		width: 20px;
		margin-right: 6px;
	}

	.m-drawer-contact {
		flex: none;
		padding: 8px 16px calc(8px + env(safe-area-inset-bottom));
		background: #006225;
	}

	.m-drawer-contact a {
		display: flex;
		align-items: center;
		min-height: 44px;
		color: #fff;
		font-size: 14px;
		overflow-wrap: anywhere;
	}

	.m-drawer-contact img {
		flex: none;
		width: 18px;
		height: 18px;
		object-fit: contain;
		margin-right: 8px;
	}
}

/* ========== 手机端（≤768px） ========== */
@media screen and (max-width: 768px) {
	body {
		overflow-x: hidden;
		padding-bottom: calc(56px + env(safe-area-inset-bottom));
	}

	/* banner 用缩放后的小图并铺满 */
	.banner .ban-pic img {
		object-fit: cover;
		object-position: center;
	}

	.smban[style*="--m-ban"] {
		background-image: var(--m-ban) !important;
		background-size: cover !important;
		background-position: center !important;
	}

	/* ---- 底部操作条（替代右侧悬浮按钮和 Leave a message） ---- */
	.sidebtn,
	.fastopen {
		display: none !important;
	}

	.m-actionbar {
		display: flex;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 900;
		height: calc(56px + env(safe-area-inset-bottom));
		padding-bottom: env(safe-area-inset-bottom);
		background: #fff;
		box-shadow: 0 -2px 10px rgba(0, 0, 0, .12);
	}

	.m-act {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 0;
		border: 0;
		font-family: inherit;
		font-size: 15px;
		color: #fff;
		cursor: pointer;
	}

	.m-act img {
		flex: none;
		width: 20px;
		height: 20px;
		object-fit: contain;
		margin-right: 6px;
	}

	.m-act-whatsapp {
		background: #157a3f;
	}

	.m-act-email {
		background: #3d4a42;
	}

	.m-act-quote {
		flex: 1.3;
		background: #006225;
		font-size: 16px;
		font-weight: bold;
	}

	/* ---- 询价表单：从底部弹出 ---- */
	.quote {
		top: auto;
		left: 0;
		right: 0;
		bottom: 0;
		width: auto;
		margin: 0;
		max-height: 85vh;
		overflow-y: auto;
		z-index: 1001;
		border-radius: 16px 16px 0 0;
		padding-bottom: env(safe-area-inset-bottom);
		box-shadow: 0 -4px 20px rgba(0, 0, 0, .2);
	}

	.quote .qtit {
		height: 54px;
		font-size: 18px;
		border-radius: 16px 16px 0 0;
	}

	.quote .close {
		top: 5px;
		right: 5px;
		width: 44px;
		height: 44px;
		padding: 12px;
	}

	.quote .fills {
		padding: 14px 16px 16px;
	}

	.quote h4 {
		margin-bottom: 12px;
		font-size: 14px;
		line-height: 20px;
	}

	.quote .fills input,
	.quote .fills textarea {
		font-size: 16px;
	}

	.quote .fills button {
		height: 46px;
		line-height: 46px;
		margin-top: 10px;
		border-radius: 23px;
	}

	/* ---- 内页 banner、面包屑 ---- */
	.smban {
		height: 200px;
	}

	.smban .word {
		bottom: 24px;
		padding: 0 16px;
	}

	.smban .word .cont {
		padding: 0 !important;
	}

	.smban .word .wta {
		font-size: 26px;
		line-height: 1.3;
		overflow-wrap: break-word;
	}

	.smban .word .wtb {
		margin-top: 6px;
		font-size: 14px;
		line-height: 1.4;
	}

	.gdways .area p {
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	/* 分享图标行占两排，手机上不显示 */
	.gdways .share {
		display: none;
	}

	/* ---- 后台富文本正文：表格横向滚动，图片和视频不超宽 ---- */
	.descs,
	.xinfo .word {
		overflow-wrap: break-word;
	}

	.descs table,
	.xinfo .word table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.descs img,
	.xinfo .word img {
		max-width: 100% !important;
		height: auto !important;
	}

	.descs iframe,
	.descs video,
	.xinfo .word iframe,
	.xinfo .word video {
		max-width: 100%;
	}

	/* ---- 产品详情页：主图全宽在上，缩略图横排在下 ---- */
	.xxcont .mains .xxboth .videos {
		float: none;
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 1;
	}

	.xxcont .mains .xxboth .videos .vidimg {
		object-fit: cover;
	}

	.xxcont .mains .xxboth .mySwiper {
		float: none;
		width: 100%;
		height: auto;
		margin: 8px 0 0;
	}

	.xxcont .mains .xxboth .mySwiper .swiper-slide img {
		aspect-ratio: 1 / 1;
		object-fit: cover;
	}

	.xxcont .mains .rlink {
		height: auto;
	}

	.xxcont .mains .fastbtn {
		display: flex;
		justify-content: center;
		gap: 12px;
	}

	.xxcont .mains .fastbtn .btna {
		margin: 0;
	}

	/* ---- 产品分类页、详情页：目录按钮在产品列表/正文上方 ---- */
	.m-cat-toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 46px;
		margin: 12px 0;
		padding: 0 16px;
		border: 0;
		background: #006225;
		color: #fff;
		font-family: inherit;
		font-size: 16px;
		font-weight: bold;
		cursor: pointer;
	}

	.m-cat-toggle::after {
		content: "";
		width: 8px;
		height: 8px;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		transform: translateY(-3px) rotate(45deg);
		transition: transform .2s;
	}

	.m-cat-toggle.on::after {
		transform: translateY(2px) rotate(-135deg);
	}

	.mains .kinds {
		display: none;
		margin-bottom: 16px;
	}

	.mains .kinds.on {
		display: block;
	}

	/* ---- 首页新闻：摘要最多 3 行 ---- */
	.eventp .item .wtb {
		-webkit-line-clamp: 3;
	}

	/* ---- 关于我们：企业文化卡片标题完整显示 ---- */
	.gypages .lists .item h3 {
		white-space: normal;
		font-size: 16px;
		line-height: 22px;
	}

	/* ---- 产品侧栏 Related Products：两列，标题放图片下面 ---- */
	.xxcont .relate .rlist {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.xxcont .relate .ritem {
		margin-bottom: 0;
	}

	.xxcont .relate .ritem .pica img {
		aspect-ratio: 1 / 1;
		object-fit: cover;
	}

	.xxcont .relate .ritem .txta,
	.xxcont .relate .ritem:hover .txta {
		position: static;
		display: block;
		height: auto;
		min-height: 44px;
		padding: 6px 4px;
		background: none;
		color: #333;
		font-size: 13px;
		line-height: 18px;
	}

	.xxcont .relate .ritem .txta span,
	.xxcont .relate .ritem:hover .txta span {
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		white-space: normal;
	}

	.xxcont .relate .ritem:hover .pica img {
		transform: none;
	}

	/* 轮播圆点：透明边框加大点击区域，外观不变 */
	.fxswiper .swiper-pagination-bullet {
		box-sizing: content-box;
		border: 10px solid transparent;
		background-clip: padding-box;
		margin: 0 !important;
	}
}