@font-face {
	font-family: "Rubik, Rubik";
	src: url("../font/HarmonyOS_Sans_SC_Regular.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

.applications-grid {
	width: 90%;
	margin: 40px auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 99px 25px;
}

.app-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
}

.app-icon-wrapper {
	width: 215px;
	height: 215px;
	background: #E5E5E6;
	box-shadow: 0px 7px 19px 0px rgba(0,0,0,0.25);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 15px;
	transition: all 0.3s ease;
	transform-origin: center;
}
.app-icon-wrapper:hover {
	transform: scale(1.05);
}

.app-icon {
	width: 70%;
	height: auto;
	object-fit: contain;
}

.app-label {
	font-family: 'Rubik, Rubik';
	font-weight: bold;
	font-size: 34px;
	color: #003255;
	font-style: normal;
	text-transform: none;
}
/* 手机端（原1986rpx → 993px，符合常规响应式断点） */
@media (max-width: 993px) {
	.applications-grid {
		width:100%;
		margin: 0px auto;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px 25px;
		margin-bottom: 30px;
	}
	
	.app-icon-wrapper {
		width: 90px;
		height: 90px;
		background: #E5E5E6;
		box-shadow: 0px 7px 19px 0px rgba(0,0,0,0.25);
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 15px;
		transition: all 0.3s ease;
		transform-origin: center;
	}
	
	.app-icon {
		width: 50%;
		height: auto;
		object-fit: contain;
	}
	
	.app-label {
		font-family: 'Rubik, Rubik';
		font-weight: bold;
		font-size: 20px;
		color: #003255;
		font-style: normal;
		text-transform: none;
	}
	
	.hero-textss {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin-top: 30px;
		position: relative;
	}
	
	.carousel-headersss h2 {
		font-family: 'Rubik, Rubik';
		font-weight: bold;
		font-size: 20px;
		color: #003255;
		text-align: left;
		margin: 0;
		margin-left: 10px;
	}
	
	.explore-moresss {
		font-family: 'Rubik, Rubik';
		font-weight: bold;
		font-size: 20px;
		color: #003255;
		text-align: left;
		text-decoration-line: underline;
		transition: transform 0.3s ease;
		transform-origin: center;
		margin: 0;
		margin-right: 10px;
	}
	
	.explore-moresss:hover {
		text-decoration: underline;
		transform: scale(1.1);
	}
	
}