@charset "utf-8";
/* ============================================================
   首页 · 苹果风格版式（在 public.css 之后加载，仅作用于首页新结构）
   原则：大留白、大字号、负字距、弱边框、图片主导、单一强调色
   ============================================================ */

.ap{
	--ap-bg:#ffffff;
	--ap-bg2:#f5f5f7;
	--ap-ink:#1d1d1f;
	--ap-sub:#6e6e73;
	--ap-line:#d2d2d7;
	--ap-blue:#0066cc;
	--ap-radius:22px;
	--ap-ease:cubic-bezier(.28,.11,.32,1);
	background-color:var(--ap-bg);
	color:var(--ap-ink);
	font-family:-apple-system,BlinkMacSystemFont,"SF Pro SC","SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑","Helvetica Neue",Arial,sans-serif;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

/* ---------- 通用版心与区块节奏 ---------- */
.ap-wrap{
	width:100%;
	max-width:1440px;
	margin:0 auto;
	padding:0 24px;
	box-sizing:border-box;
}
.ap-section{
	padding:128px 0;
	background-color:var(--ap-bg);
}
.ap-section-gray{
	background-color:var(--ap-bg2);
}

/* ---------- 标题排版 ---------- */
.ap-h2{
	margin:0;
	font-size:clamp(36px,4.4vw,56px);
	font-weight:600;
	line-height:1.07;
	letter-spacing:-.021em;
	color:var(--ap-ink);
	text-wrap:balance;
}
.ap-h2 font{
	color:inherit !important;
	font-size:inherit !important;
}
.ap-sub{
	margin:16px 0 0;
	font-size:clamp(18px,1.5vw,21px);
	line-height:1.45;
	color:var(--ap-sub);
	text-wrap:pretty;
}
.ap-head{
	max-width:880px;
	margin:0 auto 64px;
	text-align:center;
}
.ap-link{
	display:inline-flex;
	align-items:center;
	gap:4px;
	font-size:17px;
	line-height:1.4;
	color:var(--ap-blue);
	text-decoration:none;
	transition:opacity .25s var(--ap-ease);
}
.ap-link:hover{
	text-decoration:underline;
	text-underline-offset:3px;
}
.ap-link .ap-arrow{
	font-size:19px;
	line-height:1;
	transform:translateY(-1px);
}

/* ============================================================
   首屏：整幅通栏，等比显示不做放大
   ============================================================ */
.ap-hero{
	background-color:#000;
}
.ap-hero .skit-slider{
	width:100%;
	max-width:1920px;
	margin:0 auto;
	aspect-ratio:1920/700;
	height:auto;
	max-height:calc(100vh - 76px);
	min-width:0;
	background-color:#000;
	overflow:hidden;
}
.ap-hero .skitter{
	width:100% !important;
	height:100%;
	left:0;
	margin-left:0;
}
.ap-hero .skitter .box_clone,
.ap-hero .skitter .info_slide{
	display:none !important;
}
.ap-hero .skitter .image_number{
	width:8px;
	height:8px;
	margin:0 6px;
	background-color:rgba(255,255,255,.5);
	border-radius:50%;
	box-shadow:none;
}
.ap-hero .skitter .image_number.image_number_select{
	background-color:#fff;
	opacity:1;
}

/* ============================================================
   产品推荐：苹果式横向滑轨
   ============================================================ */
.ap-products{
	padding-bottom:112px;
}
.ap-rail-wrap{
	position:relative;
}
.ap-rail{
	overflow-x:auto;
	overflow-y:hidden;
	scroll-snap-type:x mandatory;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
	-ms-overflow-style:none;
	padding:6px 0 10px;
}
.ap-rail::-webkit-scrollbar{
	display:none;
}
.ap-rail ul{
	display:grid;
	grid-auto-flow:column;
	grid-auto-columns:252px;
	gap:20px;
	width:max-content;
	margin:0 auto;
	padding:0 24px;
}
.ap-card{
	scroll-snap-align:start;
	display:block;
	text-decoration:none;
}
.ap-card-media{
	display:flex;
	align-items:center;
	justify-content:center;
	aspect-ratio:1/1;
	background-color:var(--ap-bg2);
	border-radius:18px;
	overflow:hidden;
}
.ap-card-media img{
	width:100%;
	height:100%;
	padding:16px;
	box-sizing:border-box;
	object-fit:contain;
	transition:transform .6s var(--ap-ease);
}
.ap-card:hover .ap-card-media img{
	transform:scale(1.05);
}
.ap-card-title{
	display:block;
	margin-top:18px;
	font-size:17px;
	line-height:1.35;
	color:var(--ap-ink);
	text-align:center;
	letter-spacing:-.01em;
	overflow:hidden;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
}
/* 滑轨左右按钮 */
.ap-rail-btn{
	position:absolute;
	top:calc(50% - 32px);
	z-index:5;
	width:36px;
	height:36px;
	padding:0;
	border:none;
	border-radius:50%;
	background-color:rgba(210,210,215,.72);
	color:#1d1d1f;
	font-size:17px;
	line-height:36px;
	text-align:center;
	cursor:pointer;
	opacity:0;
	transition:opacity .3s var(--ap-ease),background-color .3s var(--ap-ease);
}
.ap-rail-wrap:hover .ap-rail-btn{
	opacity:1;
}
.ap-rail-btn:hover{
	background-color:rgba(180,180,187,.92);
}
.ap-rail-btn:disabled{
	opacity:0 !important;
	cursor:default;
}
.ap-rail-prev{
	left:6px;
}
.ap-rail-next{
	right:6px;
}
.ap-more{
	margin-top:52px;
	text-align:center;
}

/* ============================================================
   解决方案：两列大卡片（苹果首页最典型的 tile 网格）
   ============================================================ */
.ap-tiles{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:14px;
	/* 限制网格总宽：单张配图显示宽度约 510px，
	   在 2 倍屏下正好接近原图 1028px 的像素密度，避免放大发虚 */
	max-width:1080px;
	margin:0 auto;
}
.ap-tile{
	display:flex;
	flex-direction:column;
	background-color:#fff;
	border-radius:var(--ap-radius);
	overflow:hidden;
	transition:transform .6s var(--ap-ease),box-shadow .6s var(--ap-ease);
}
.ap-tile:hover{
	transform:translateY(-3px);
	box-shadow:0 18px 48px rgba(0,0,0,.07);
}
.ap-tile-media{
	aspect-ratio:4/3;
	overflow:hidden;
	background-color:var(--ap-bg2);
	display:flex;
	align-items:center;
	justify-content:center;
}
.ap-tile-media img{
	display:block;
	width:100%;
	height:100%;
	padding:18px;
	box-sizing:border-box;
	object-fit:contain;
	transition:transform .8s var(--ap-ease);
}
.ap-tile:hover .ap-tile-media img{
	transform:scale(1.03);
}
.ap-tile-body{
	padding:32px 34px 36px;
}
.ap-tile-h{
	margin:0;
	font-size:clamp(24px,2.1vw,32px);
	font-weight:600;
	line-height:1.15;
	letter-spacing:-.02em;
	color:var(--ap-ink);
}
.ap-tile-sub{
	margin:10px 0 0;
	font-size:17px;
	line-height:1.4;
	color:var(--ap-sub);
}
.ap-tile-text{
	margin:20px 0 0;
	font-size:15px;
	line-height:1.72;
	color:var(--ap-sub);
}
.ap-tile-text ul{
	margin:0;
	padding:0;
	list-style:none;
}
.ap-tile-text li{
	position:relative;
	margin:7px 0;
	padding-left:16px;
}
.ap-tile-text li::before{
	content:"";
	position:absolute;
	left:0;
	top:.72em;
	width:4px;
	height:4px;
	border-radius:50%;
	background-color:var(--ap-line);
}
.ap-tile-link{
	margin-top:24px;
}

/* ============================================================
   关于我们：左文右图
   ============================================================ */
.ap-about-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	align-items:center;
	gap:clamp(40px,6vw,96px);
}
.ap-about-text .ap-h2{
	font-size:clamp(32px,3.6vw,48px);
}
.ap-body{
	margin:24px 0 0;
	max-width:52ch;
	font-size:17px;
	line-height:1.76;
	color:var(--ap-sub);
	text-wrap:pretty;
}
.ap-body p{
	margin:0 0 16px;
}
.ap-body p:last-child{
	margin-bottom:0;
}
.ap-body font,
.ap-body span,
.ap-body b{
	color:inherit !important;
	font-size:inherit !important;
	font-weight:inherit !important;
}
.ap-body br + br{
	display:none;
}
.ap-about-more{
	margin-top:32px;
}
.ap-about-media img{
	display:block;
	width:100%;
	height:auto;
	border-radius:var(--ap-radius);
	background-color:var(--ap-bg2);
}

/* ============================================================
   新闻资讯：三列卡片
   ============================================================ */
.ap-news{
	background-color:var(--ap-bg2);
}
.ap-news-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
}
.ap-news-card{
	display:flex;
	flex-direction:column;
	background-color:#fff;
	border-radius:20px;
	overflow:hidden;
	text-decoration:none;
	transition:transform .5s var(--ap-ease),box-shadow .5s var(--ap-ease);
}
.ap-news-card:hover{
	transform:translateY(-4px);
	box-shadow:0 18px 44px rgba(0,0,0,.08);
}
.ap-news-media{
	aspect-ratio:16/10;
	overflow:hidden;
	background-color:var(--ap-bg2);
}
.ap-news-media img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .8s var(--ap-ease);
}
.ap-news-card:hover .ap-news-media img{
	transform:scale(1.04);
}
.ap-news-body{
	display:flex;
	flex-direction:column;
	flex:1;
	padding:26px 28px 30px;
}
.ap-news-date{
	font-size:12px;
	line-height:1.3;
	color:var(--ap-sub);
	letter-spacing:.01em;
}
.ap-news-h{
	margin:10px 0 0;
	font-size:21px;
	font-weight:600;
	line-height:1.32;
	letter-spacing:-.012em;
	color:var(--ap-ink);
	overflow:hidden;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
}
.ap-news-intro{
	margin:12px 0 0;
	font-size:15px;
	line-height:1.68;
	color:var(--ap-sub);
	overflow:hidden;
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
}
.ap-news-empty{
	font-size:17px;
	color:var(--ap-sub);
	text-align:center;
}

/* ============================================================
   进入视口渐显（仅支持 scroll-driven animation 的浏览器）
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
	@supports (animation-timeline: view()){
		@keyframes apRise{
			from{opacity:0;transform:translateY(34px);}
			to{opacity:1;transform:translateY(0);}
		}
		.ap-head,
		.ap-tile,
		.ap-about-text,
		.ap-about-media,
		.ap-news-card{
			animation:apRise linear both;
			animation-timeline:view();
			animation-range:entry 6% cover 26%;
		}
	}
}

/* ============================================================
   响应式：窄屏收敛为单列
   ============================================================ */
@media (max-width:1100px){
	.ap-section{
		padding:88px 0;
	}
	.ap-tiles{
		grid-template-columns:1fr;
	}
	.ap-about-grid{
		grid-template-columns:1fr;
		gap:40px;
	}
	.ap-about-media{
		order:-1;
	}
	.ap-news-grid{
		grid-template-columns:1fr;
	}
	.ap-tile-body{
		padding:30px 28px 34px;
	}
	.ap-hero .skit-slider{
		max-height:none;
	}
}