/*
 * About page (page-about-us.php) — resource cards in "Discover the A1 Difference".
 *
 * styles.css mobile column layout is scoped to `.about` (missing on ported markup).
 * Grid: mobile portrait 1-col, mobile landscape + tablet 2-col, desktop 3-col.
 */

.page-about-us .about-resources {
	box-sizing: border-box;
	max-width: 100%;
	overflow-x: clip;
}

/* Mobile portrait only: single column + symmetric gutters. */
@media screen and (max-width: 47.9375em) and (orientation: portrait) {
	.page-about-us .about-resources {
		padding: 1.5rem 1.25rem;
	}

	.page-about-us .about-resources__cards {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		margin-top: 2rem;
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	/* Beat Foundation .grid-margin-x > .cell / .small-6 gutters in single-col mode. */
	.page-about-us .about-resources__cards.grid-margin-x > .about-card.cell {
		width: 100%;
		max-width: 100%;
		flex: 0 0 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: 0;
		padding-right: 0;
	}

	.page-about-us .about-card {
		margin-bottom: 2.5rem;
		width: 100%;
		min-width: 0;
	}

	.page-about-us .about-card__content {
		padding: 2.5rem 1rem 1rem;
		justify-content: flex-start;
		gap: 0.75rem;
		min-height: 0;
		height: auto;
	}

	.page-about-us .about-card__images {
		margin-top: -38px;
	}

	.page-about-us .about-card__images img {
		width: 65px;
		max-width: 65px;
	}

	.page-about-us .about-card__title {
		text-align: center;
		line-height: 1.3;
		overflow-wrap: anywhere;
		word-break: break-word;
		margin-top: 0.25rem;
	}

	.page-about-us .about-card__link {
		margin-top: 0.75rem;
	}
}

/* Mobile landscape (≤767px wide): 2-col Foundation grid. */
@media screen and (max-width: 47.9375em) and (orientation: landscape) {
	.page-about-us .about-resources {
		padding: 1.5rem 1.25rem;
	}

	.page-about-us .about-resources__cards {
		margin-top: 2rem;
	}

	.page-about-us .about-resources .about-card__content {
		padding: 3rem 0.75rem 1rem;
		justify-content: flex-start;
		gap: 0.5rem;
		min-height: 0;
		height: auto;
	}

	.page-about-us .about-card__images {
		margin-top: -36px;
	}

	.page-about-us .about-card__title {
		text-align: center;
		line-height: 1.3;
		overflow-wrap: anywhere;
		word-break: break-word;
		margin-top: 0.25rem;
	}

	.page-about-us .about-card__link {
		margin-top: 0.75rem;
	}
}

/* Tablet (768px–1023px): 2-col grid; restore icon-band padding (live: 4rem). */
@media screen and (min-width: 48em) and (max-width: 63.9375em) {
	.page-about-us .about-resources {
		padding: 1.5rem 1.5rem;
	}

	.page-about-us .about-resources__cards {
		margin-top: 2.5rem;
	}

	.page-about-us .about-resources .about-card__content {
		padding: 4rem 1rem 1rem;
		justify-content: flex-start;
		gap: 0.5rem;
		min-height: 0;
		height: auto;
	}

	.page-about-us .about-resources .about-card__images {
		margin-top: -36px;
	}

	.page-about-us .about-resources .about-card__images img {
		width: 95px;
		max-width: 95px;
	}

	.page-about-us .about-card__title {
		text-align: center;
		line-height: 1.3;
		overflow-wrap: anywhere;
		word-break: break-word;
		margin-top: 0.25rem;
	}

	.page-about-us .about-card__link {
		margin-top: 0.75rem;
	}
}