/* ABAPP Quick Service V2: four responsive cards with content-aware widths. */

.abapp-quick {
	padding: 68px 0 78px;
	overflow: visible;
}

.abapp-quick__inner {
	width: min(100% - 48px, 1220px);
	overflow: visible;
}

.abapp-quick__heading-row {
	margin-bottom: 30px;
}

.abapp-quick__controls,
.abapp-quick__dots {
	display: none !important;
}

.abapp-quick__viewport {
	overflow: visible !important;
	padding: 12px 10px 22px;
	margin: -12px -10px -22px;
	scroll-snap-type: none !important;
}

.abapp-quick__track {
	display: flex !important;
	align-items: stretch;
	gap: 16px;
	width: 100%;
}

.abapp-quick-card {
	flex: var(--abapp-card-grow, 1) 1 205px;
	min-width: 0;
	min-height: 230px !important;
	height: auto;
	padding: 28px 24px 24px;
	overflow: hidden;
	color: #132a46;
	background: linear-gradient(145deg, #fbfdff 0%, #f2f7fb 100%);
	border: 1px solid #d8e4ef;
	border-radius: 16px;
	box-shadow:
		0 16px 34px rgba(9, 39, 74, 0.085),
		0 3px 9px rgba(9, 39, 74, 0.045),
		inset 0 1px 0 rgba(255, 255, 255, 0.92);
	scroll-snap-align: none;
	transition:
		transform 180ms ease,
		border-color 180ms ease,
		box-shadow 180ms ease,
		background 180ms ease;
}

.abapp-quick-card:hover,
.abapp-quick-card:focus-visible {
	border-color: #b8cee3;
	box-shadow:
		0 22px 46px rgba(9, 39, 74, 0.13),
		0 5px 14px rgba(9, 39, 74, 0.06),
		inset 0 1px 0 rgba(255, 255, 255, 1);
	transform: translateY(-4px);
}

.abapp-quick-card__icon {
	width: 50px;
	height: 50px;
	margin-bottom: 22px;
}

.abapp-quick-card__title {
	max-width: none;
	font-size: clamp(19px, 1.55vw, 24px);
	line-height: 1.08;
}

.abapp-quick-card__action {
	align-items: flex-start;
	margin-top: auto !important;
	padding-top: 28px !important;
	font-size: 13.5px;
	line-height: 1.35;
}

.abapp-quick-card__action span {
	min-width: 0;
}

.abapp-quick-card__action svg {
	margin-top: 1px;
}

/* Remove the hairline seam between Hero and network block. */
.abapp-hero {
	border-bottom: 0 !important;
	box-shadow: none !important;
}

.abapp-network {
	margin-top: -2px !important;
	border-top: 0 !important;
	box-shadow: none !important;
	background-color: #102136 !important;
}

.abapp-hero + .abapp-network {
	border-top: 0 !important;
}

@media (max-width: 1199px) and (min-width: 1000px) {
	.abapp-quick__inner {
		width: min(100% - 36px, 1120px);
	}

	.abapp-quick__track {
		gap: 13px;
	}

	.abapp-quick-card {
		flex-basis: 185px;
		min-height: 218px !important;
		padding: 24px 20px 22px;
	}

	.abapp-quick-card__title {
		font-size: 19px;
	}

	.abapp-quick-card__action {
		font-size: 12.5px;
	}
}

@media (max-width: 999px) {
	.abapp-quick {
		padding: 54px 0 62px;
	}

	.abapp-quick__inner {
		width: min(100% - 32px, 820px);
	}

	.abapp-quick__viewport {
		padding: 10px 8px 18px;
		margin: -10px -8px -18px;
	}

	.abapp-quick__track {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-rows: 1fr;
		align-items: stretch;
		gap: 16px;
	}

	.abapp-quick-card {
		width: 100%;
		height: 100%;
		min-height: 224px !important;
		padding: 25px 22px 23px;
	}
}

@media (max-width: 639px) {
	.abapp-quick {
		padding: 44px 0 50px;
	}

	.abapp-quick__inner {
		width: min(100% - 28px, 520px);
	}

	.abapp-quick__track {
		grid-template-columns: 1fr;
		grid-auto-rows: auto;
		gap: 13px;
	}

	.abapp-quick-card {
		height: auto;
		min-height: 0 !important;
		padding: 23px 21px 21px;
		border-radius: 14px;
	}

	.abapp-quick-card__icon {
		margin-bottom: 17px;
	}

	.abapp-quick-card__title {
		font-size: 21px;
	}

	.abapp-quick-card__action {
		margin-top: 22px !important;
		padding-top: 0 !important;
		font-size: 13px;
	}
}