/*
 * Mobile-only layout tuning for ConsultZone.
 * Scoped to phones (<= 640px). Desktop/tablet are untouched, so the desktop
 * design stays exactly as-is. Cards are scaled DOWN keeping their aspect ratio,
 * so the logos/images still fit inside — just smaller.
 */

@media (max-width: 640px) {

	/* ---- Featured-clients logo cards (300x230 -> ~210x165, ratio kept) ----
	   Each card = a logo (max 120px) + a 58px footer bar, so we shrink those
	   inner pieces too, otherwise the logo would overflow the shorter card. */
	.w-\[300px\].h-\[230px\] {
		width: 210px !important;
		height: 165px !important;
	}
	.w-\[300px\].h-\[230px\] img {
		max-height: 82px !important;
	}
	.w-\[300px\].h-\[230px\] .h-\[58px\] {
		height: 42px !important;
	}

	/* ---- Partner cards (260x200 -> 190x146, ratio kept) ----
	   These are building photos (object-cover), so they just fill the smaller
	   card — no inner adjustment needed. Different classes from the client cards,
	   which is why the earlier rule didn't touch them. */
	.w-\[260px\].h-\[200px\] {
		width: 190px !important;
		height: 146px !important;
	}

	/* Big gradient spotlight card: trim the huge padding + radius on phones. */
	.rounded-\[2\.5rem\] {
		border-radius: 1.5rem !important;
	}
	.rounded-\[2\.5rem\].p-10 {
		padding: 1.5rem !important;
	}

	/* Trim oversized vertical section spacing on phones. */
	section.py-12 {
		padding-top: 2.25rem !important;
		padding-bottom: 2.25rem !important;
	}
}
