/* Scoped to About Us; the theme continues to own all editable content. */
.grit-about-trades {
	background: linear-gradient(180deg, #fff 0%, #f4f6f8 100%);
	overflow: clip;
}
.grit-about-trades .grit-centered {
	margin-bottom: clamp(1.75rem, 4vw, 3rem);
}
.grit-about-trades .grit-cards {
	align-items: stretch;
	gap: clamp(1.25rem, 2.5vw, 1.75rem);
}
.grit-about-trades .grit-about-card {
	--about-pad: clamp(1.25rem, 2.3vw, 1.75rem);
	position: relative;
	min-width: 0;
	padding: 0 var(--about-pad) 1.75rem;
	overflow: hidden;
	border: 1px solid rgba(0, 22, 42, .075);
	border-radius: 12px;
	box-shadow: 0 6px 22px rgba(0, 22, 42, .075);
	transition: transform 280ms cubic-bezier(.2,.7,.2,1), box-shadow 280ms ease, border-color 280ms ease;
}
.grit-about-card::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: var(--about-pad);
	width: 3rem;
	height: 3px;
	background: var(--grit-primary, #ff2f00);
	transition: width 280ms ease;
}
.grit-about-card .grit-about-card__photo {
	position: relative;
	flex: 0 0 auto;
	aspect-ratio: 3 / 2;
	margin: 0 calc(-1 * var(--about-pad));
	overflow: hidden;
	background: var(--grit-navy, #00162a);
}
.grit-about-card__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 550ms cubic-bezier(.2,.7,.2,1);
}
.grit-about-card .grit-about-card__icon {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 3.5rem;
	height: 3.5rem;
	margin: -1.75rem 0 1.15rem;
	border: 4px solid #fff;
	border-radius: 12px;
	background: var(--grit-navy, #00162a);
	color: #fff;
	box-shadow: 0 4px 10px rgba(0, 22, 42, .12);
	transition: transform 300ms ease;
}
.grit-about-card__icon svg { width: 1.9rem; height: 1.9rem; }
.grit-about-trades .grit-about-card h3 { margin-bottom: .8rem; }
.grit-about-trades .grit-about-card p { color: var(--grit-text-muted, #5a6b7a); }
.grit-about-trades .grit-cards__action { margin-top: 2.5rem; }

@media (min-width: 45em) {
	.grit-about-trades .grit-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.grit-about-trades .grit-about-card:nth-child(2) { top: -10px; }
}
@media (max-width: 44.99em) {
	.grit-about-trades .grit-cards { grid-template-columns: 1fr; max-width: 32rem; margin-inline: auto; }
	.grit-about-card .grit-about-card__photo { max-height: none; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
	.grit-about-trades .grit-about-card:hover {
		transform: translateY(-7px);
		box-shadow: 0 16px 34px rgba(0, 22, 42, .13);
		border-color: rgba(0, 22, 42, .14);
	}
	.grit-about-card:hover .grit-about-card__photo img { transform: scale(1.035); }
	.grit-about-card:hover .grit-about-card__icon { transform: rotate(-5deg); }
	.grit-about-card:hover::after { width: calc(100% - var(--about-pad) * 2); }
}
/* Nothing is hidden before the observer runs, so blocked JS cannot hide content. */
@media (prefers-reduced-motion: no-preference) {
	.grit-about-card.is-entering { animation: grit-about-arrive 760ms both; animation-delay: var(--about-delay, 0ms); }
}
@keyframes grit-about-arrive {
	0% { opacity: .15; transform: translateY(24px) scale(.985); }
	60% { opacity: 1; transform: translateY(-5px) scale(1); }
	80% { transform: translateY(2px); }
	100% { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.grit-about-trades *, .grit-about-trades *::after { animation: none !important; transition: none !important; }
}
