@charset "utf-8";

/* ==========================================================================
   LEES New Products — Elementor Widget
   从原站 CSS 中提取本板块相关规则，统一加 .lnp- 前缀做命名空间隔离，
   避免与主题 / 其它插件的 .item .tit .img 等通用类名冲突。
   原始来源类名对照：
     .bg1                 -> .lnp-section
     .wrapper             -> .lnp-wrapper
     .tit_box1            -> .lnp-title
     .product_menu        -> .lnp-menu
     .product_wrap        -> .lnp-carousel
     .product_swiper      -> .lnp-swiper
     .swiper-button-prev  -> .lnp-arrow--prev
   ========================================================================== */

.lnp-section {
	--lnp-theme-color: #FFB400;
	background: #f1f1f1;
	position: relative;
	overflow: hidden;
	padding-bottom: 100px;   /* 原 .pb100 */
}

.lnp-section *,
.lnp-section *::before,
.lnp-section *::after {
	box-sizing: border-box;
}

.lnp-wrapper {
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	padding-left: 30px;
	padding-right: 30px;
}

.lnp-section img {
	display: block;
	max-width: 100%;
	height: auto;
}

.lnp-section a {
	text-decoration: none;
	color: inherit;
}

/* --------------------------------------------------------------------------
   板块标题（原 .tit_box1）
   -------------------------------------------------------------------------- */

.lnp-title {
	padding: 80px 0 50px;
	text-align: center;
}

.lnp-title__text {
	margin: 0;
	font-size: 48px;
	line-height: 1;
	font-weight: 700;      /* 原 font-family:'GothicB' */
	text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   产品分类卡片（原 .product_menu）
   -------------------------------------------------------------------------- */

.lnp-menu {
	padding: 30px 30px 0;
}

.lnp-menu__list {
	display: flex;
	flex-wrap: wrap;
	margin: -10px;
}

.lnp-menu__item {
	width: 25%;
	padding: 10px;
}

.lnp-menu__link {
	display: block;
	position: relative;
	overflow: hidden;
	height: 100%;
}

.lnp-menu__bg {
	position: relative;
	z-index: 1;
	border-radius: 5px;
	overflow: hidden;
}

.lnp-menu__bg img {
	width: 100%;
	transition: transform .6s ease;
}

/* hover 时从左往右铺开的主题色渐变遮罩 */
.lnp-menu__bg::after {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	background: linear-gradient(to right, rgba(255, 180, 0, 1), rgba(255, 180, 0, .1));
	transition: width .4s ease;
}

.lnp-menu__info {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	padding: 35px 0 0 40px;
	z-index: 2;
}

.lnp-menu__title {
	font-size: 36px;
	font-weight: 700;
	color: #fff;
	width: 60%;
	line-height: 1;
}

.lnp-menu__icon {
	position: absolute;
	right: 25px;
	bottom: 15px;
	max-width: 60%;
}

.lnp-menu__more {
	display: none;
	align-items: center;
	border: 1px solid #333;
	border-radius: 100px;
	font-size: 14px;
	font-weight: 700;
	padding: 2px 15px;
	text-transform: uppercase;
	margin-top: 60px;
	transition: all .4s ease;
	color: #333;
}

.lnp-menu__more svg {
	width: 14px;
	height: 14px;
	margin-left: 6px;
	flex: none;
}

.lnp-menu__link:hover .lnp-menu__bg::after {
	width: 100%;
}

.lnp-menu__link:hover .lnp-menu__bg img {
	transform: scale(1.06);
}

.lnp-menu__link:hover .lnp-menu__more {
	display: inline-flex;
}

.lnp-menu__more:hover {
	background: #333;
	color: #fff;
	border-color: #333;
}

/* --------------------------------------------------------------------------
   新品轮播（原 .product_wrap / .product_swiper）
   -------------------------------------------------------------------------- */

.lnp-carousel {
	position: relative;
}

.lnp-swiper {
	overflow: hidden;
}

.lnp-slide__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

.lnp-slide__bigtitle {
	font-size: 160px;
	color: var(--lnp-theme-color);
	text-transform: uppercase;
	line-height: 1;
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}

.lnp-slide__img {
	max-width: 52%;
	position: relative;
	margin-top: -80px;
}

.lnp-slide__img img {
	width: 100%;
	transition: transform .6s ease;
}

.lnp-slide__link:hover .lnp-slide__img img {
	transform: scale(1.04);
}

.lnp-slide__con {
	padding-top: 60px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.lnp-slide__title {
	font-size: 22px;
	font-weight: 700;
	color: var(--lnp-theme-color);
	text-align: center;
	margin-bottom: 20px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.lnp-slide__desc p {
	font-size: 18px;
	position: relative;
	padding-left: 16px;
	margin: 0 0 4px;
}

.lnp-slide__desc p::before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 12px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--lnp-theme-color);
}

/* --------------------------------------------------------------------------
   左右箭头（原 .product_wrap .swiper-button-prev / next）
   -------------------------------------------------------------------------- */

.lnp-arrow {
	position: absolute;
	top: 36%;
	width: 295px;
	height: 341px;
	z-index: 10;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity .3s ease;
}

.lnp-arrow--prev {
	left: -10%;
}

.lnp-arrow--next {
	right: -10%;
}

.lnp-arrow img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.lnp-arrow__svg {
	width: 48px;
	height: 48px;
	color: var(--lnp-theme-color);
}

.lnp-arrow:hover {
	opacity: .75;
}

.lnp-arrow.swiper-button-disabled {
	opacity: .35;
	pointer-events: none;
}

/* 分页圆点 */
.lnp-pagination {
	position: relative;
	margin-top: 20px;
}

.lnp-pagination .swiper-pagination-bullet-active {
	background: var(--lnp-theme-color);
}

/* ==========================================================================
   响应式（断点与原站保持一致）
   ========================================================================== */

@media screen and (max-width: 1620px) {

	.lnp-wrapper {
		padding-left: 30px;
		padding-right: 30px;
	}

	.lnp-menu__icon {
		width: 50%;
	}

	.lnp-menu__title {
		font-size: 36px;
	}

	.lnp-slide__bigtitle {
		font-size: 160px;
	}

	.lnp-arrow {
		width: 160px;
	}

	.lnp-arrow--prev {
		left: 0;
	}

	.lnp-arrow--next {
		right: 0;
	}

	.lnp-title {
		padding: 60px 0 30px;
	}

	.lnp-title__text {
		font-size: 54px;
	}
}

@media screen and (max-width: 1480px) {

	.lnp-menu__info {
		padding: 25px 0 0 25px;
	}

	.lnp-menu__title {
		font-size: 24px;
	}

	.lnp-title__text {
		font-size: 46px;
	}

	.lnp-section {
		padding-bottom: 60px;
	}
}

@media screen and (max-width: 1280px) {

	.lnp-wrapper {
		padding-left: 20px;
		padding-right: 20px;
	}

	.lnp-title__text {
		font-size: 36px;
	}

	.lnp-slide__bigtitle {
		font-size: 140px;
	}

	.lnp-slide__img {
		margin-top: -40px;
	}
}

@media screen and (max-width: 1024px) {

	.lnp-title {
		padding: 50px 0 20px;
	}

	.lnp-title__text {
		font-size: 30px;
	}

	.lnp-menu__list {
		flex-wrap: wrap;
	}

	.lnp-menu__item {
		width: 50%;
		padding: 10px;
	}

	.lnp-menu__info {
		padding: 35px 0 0 35px;
	}

	.lnp-slide__bigtitle {
		font-size: 100px;
	}

	.lnp-slide__desc p {
		font-size: 18px;
	}

	.lnp-section {
		padding-bottom: 40px;
	}
}

@media screen and (max-width: 768px) {

	.lnp-wrapper {
		padding-left: 15px;
		padding-right: 15px;
	}

	.lnp-menu {
		padding: 15px 15px 0;
	}

	.lnp-menu__item {
		padding: 6px;
	}

	.lnp-menu__info {
		padding: 15px;
	}

	.lnp-menu__title {
		font-size: 16px;
		width: 100%;
		text-align: center;
	}

	.lnp-menu__icon {
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		bottom: 10px;
	}

	.lnp-menu__more {
		display: none !important;
	}

	.lnp-title {
		padding: 30px 0 20px;
	}

	.lnp-title__text {
		font-size: 24px;
	}

	.lnp-carousel {
		overflow: hidden;
	}

	.lnp-slide__bigtitle {
		font-size: 36px;
	}

	.lnp-slide__img {
		margin-top: -10px;
	}

	.lnp-arrow {
		width: 50px;
		height: 50px;
		top: 40%;
	}

	.lnp-arrow__svg {
		width: 28px;
		height: 28px;
	}

	.lnp-slide__title {
		font-size: 16px;
	}

	.lnp-slide__desc p {
		font-size: 14px;
	}

	.lnp-slide__con {
		padding-top: 30px;
	}

	.lnp-slide__desc p::before {
		left: 3px;
		top: 9px;
	}

	.lnp-section {
		padding-bottom: 30px;
	}
}

/* --------------------------------------------------------------------------
   可选：入场动画（对应原站 wow fadeInUp / fadeInDown）
   如果站点已装 WOW.js + animate.css，可删掉这段用原来的。
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {

	.lnp-menu__item {
		opacity: 0;
		transform: translateY(24px);
		animation: lnpFadeInUp .8s ease forwards;
		animation-delay: var(--lnp-delay, 0s);
	}

	.lnp-title__text {
		opacity: 0;
		transform: translateY(-24px);
		animation: lnpFadeInDown .8s ease forwards;
	}
}

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

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

/* Elementor 编辑器内禁用入场动画，避免重复触发看不见内容 */
.elementor-editor-active .lnp-menu__item,
.elementor-editor-active .lnp-title__text {
	opacity: 1;
	transform: none;
	animation: none;
}