/**
 * Sekcja: certyfikaty jakości.
 * Figma 14557:4370 — pas 1440×470 na bieli. Nagłówek 235×116 (48/57,6) od (162,5, 177),
 * karty od (680,5, 100), wysokość 270, odstęp 24: 255 i 318 px. Wnętrze karty ma
 * margines 20, nazwa 18/1.35 w zieleni, opis 16/24 w tuszu 20 px niżej, grafika 129×129
 * przy dolnej krawędzi.
 *
 * Szerokości kart w makiecie wynikają z długości opisu (auto-layout „hug"), więc tu
 * też są liczone treścią — stałe 255/318 rozjechałyby się przy innym tekście.
 */

.about-certs {
	padding-block: 100px;
	background-color: var(--color-white);
}

.about-certs__inner {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--space-lg);
}

/* Blok nagłówka ma w makiecie stałe 235 px (14557:4371) — przy `max-width` pudełko
   kurczy się do długości napisu i traci 4 px względem projektu. */
.about-certs__heading {
	width: 235px;
	/* Nagłówek startuje 77 px pod górną krawędzią kart (177 − 100). */
	margin: 77px 0 0 84px;
}

.about-certs__list {
	display: flex;
	justify-content: flex-end;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

.about-certs__item {
	display: flex;
	flex-direction: column;
	flex: 0 1 auto;
	width: max-content;
	max-width: 340px;
	min-height: 270px;
	padding: 20px;
	border: 1px solid var(--color-border-mint-strong);
	border-radius: var(--radius-sm);
	background-color: var(--color-white);
}

.about-certs__name {
	margin: 0;
	font-size: var(--fs-body);
	font-weight: 500;
	line-height: var(--lh-label);
	color: var(--color-primary);
}

.about-certs__text {
	margin: 20px 0 0;
	font-size: var(--fs-body-sm);
	line-height: 24px;
	color: var(--color-muted);
}

/* Grafika ma w makiecie stałe 129×129 (14557:4378) i stoi przy dolnej krawędzi karty. */
.about-certs__logo {
	width: 129px;
	height: 129px;
	margin-top: auto;
}

.about-certs__logo-img {
	display: block;
	width: 129px;
	height: 129px;
	object-fit: cover;
	object-position: center;
}

/* Figma 14557:4370: grupa wyśrodkowana, odstęp nagłówek–karty 283. Przy 1440
   daje pierwszą kartę na x≈680 (space-between dosuwał ją do x=762). */
@media (min-width: 1440px) {
	.about-certs__inner {
		align-items: center;
		justify-content: center;
		gap: 283px;
	}

	.about-certs__heading {
		margin: 0;
	}

	.about-certs__list {
		justify-content: flex-start;
	}
}

/* Margines 84 px nagłówka i karty hug mieszczą się przy 1440. Między 992 a 1439
   lista musi móc się skurczyć — inaczej druga karta ISO wychodzi ~9 px za ekran. */
@media (min-width: 992px) and (max-width: 1439px) {
	.about-certs__heading {
		margin-left: 0;
		min-width: 0;
	}

	.about-certs__list {
		min-width: 0;
		flex: 1 1 auto;
	}

	.about-certs__item {
		min-width: 0;
		flex: 1 1 0;
		width: auto;
	}
}

@media (max-width: 991px) {
	.about-certs {
		padding-block: var(--space-section);
	}

	.about-certs__inner {
		flex-direction: column;
		gap: var(--space-lg);
	}

	.about-certs__heading {
		max-width: none;
		margin: 0;
	}

	.about-certs__list {
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.about-certs__item {
		width: auto;
		flex: 1 1 260px;
	}
}