/**
 * Why Choose Us section (BEM block: .why-choose-us).
 */
.why-choose-us__header {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: var(--space-lg);
}

.why-choose-us__intro {
	max-width: 360px;
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
}

.why-choose-us__list {
	margin-top: var(--space-xl);
	border-top: 1px solid var(--color-border);
}

.why-choose-us__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-lg);
	padding-block: var(--space-lg);
	border-bottom: 1px solid var(--color-border);
	transition: background-color var(--duration-fast) var(--ease-out);
	padding: var(--space-2xs);
}

.why-choose-us__row:hover {
	background-color: var(--color-bg-alt);
}

.why-choose-us__row-text {
	flex: 1 1 auto;
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: var(--space-md);
	row-gap: var(--space-2xs);
	max-width: 640px;
}

.why-choose-us__number {
	font-family: var(--font-display);
	font-size: var(--fs-h3);
	color: var(--color-accent);
	grid-row: span 2;
}

.why-choose-us__title {
	font-size: var(--fs-h3);
	align-self: end;
}

.why-choose-us__description {
	grid-column: 2;
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
}

.why-choose-us__row-media {
	flex: 0 0 auto;
	width: 120px;
	height: 90px;
	border-radius: var(--radius-sm);
	overflow: hidden;
}

.why-choose-us__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 700px) {
	.why-choose-us__row {
		flex-direction: column;
		align-items: flex-start;
	}

	.why-choose-us__row-media {
		width: 100%;
		height: 160px;
	}
}