/* =======================================================================
 * Nextstage Services Contact Widget — grid of service cards with contact
 * (phone / email / zalo) per card. Cloned from SePay's Liên hệ page.
 * ======================================================================= */
.nssc-services { padding: 4rem 0; }
.nssc-services .nssc-container { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 1.5rem; box-sizing: border-box; }
.nssc-services *, .nssc-services *::before, .nssc-services *::after { box-sizing: border-box; }

.nssc-services .nssc-heading { margin: 0 auto 3rem; max-width: 720px; text-align: center; }
.nssc-services .nssc-heading h2 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 1rem + 2vw, 2.75rem);
	line-height: 1.25;
	color: #1e2022;
	margin: 0 0 0.75rem;
}
.nssc-services .nssc-heading p { color: #677788; font-size: 1rem; line-height: 1.6; margin: 0; }

.nssc-services .nssc-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 576px) { .nssc-services .nssc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .nssc-services .nssc-grid { grid-template-columns: repeat(var(--nssc-cols, 3), 1fr); } }

.nssc-services .nssc-card {
	background: #fff;
	border: 1px solid #e7eaf3;
	border-radius: 1rem;
	padding: 1.75rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.nssc-services .nssc-card:hover {
	transform: translateY(-4px);
	border-color: rgba(55, 126, 255, 0.4);
	box-shadow: 0 1.25rem 2.5rem rgba(55, 126, 255, 0.14);
}

.nssc-services .nssc-card__icon {
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 0.75rem;
	background: rgba(55, 126, 255, 0.1);
	color: #377eff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	flex: 0 0 auto;
}
.nssc-services .nssc-card__icon i,
.nssc-services .nssc-card__icon svg { color: #377eff !important; fill: #377eff !important; width: 1.5rem; height: 1.5rem; }
.nssc-services .nssc-card__icon svg * { fill: #377eff !important; }
.nssc-services .nssc-card__icon img { width: 1.75rem; height: 1.75rem; object-fit: contain; }

.nssc-services .nssc-card__title {
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.35;
	color: #1e2022;
	margin: 0;
}
.nssc-services .nssc-card__desc {
	color: #677788;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin: 0;
	flex: 1;
}

.nssc-services .nssc-card__contacts {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-top: 0.5rem;
	padding-top: 1rem;
	border-top: 1px dashed #e7eaf3;
}
.nssc-services .nssc-card__contact {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #1e2022;
	font-size: 0.9375rem;
	font-weight: 500;
	text-decoration: none;
	transition: color 0.2s;
}
.nssc-services .nssc-card__contact:hover { color: #377eff; }
.nssc-services .nssc-card__contact svg { width: 16px; height: 16px; flex: 0 0 auto; color: #377eff; }

.nssc-services .nssc-card__cta {
	margin-top: 0.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.625rem 1rem;
	border-radius: 0.5rem;
	background: #377eff;
	color: #fff !important;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}
.nssc-services .nssc-card__cta:hover {
	background: #1f66e6;
	transform: translateY(-1px);
	box-shadow: 0 0.4rem 1rem rgba(55, 126, 255, 0.25);
}
