/* ==========================================================================
   Component: Card industry
   Фото 890:526 с градиентом, теги поверх фото (≥1024) или под заголовком (375).
   1920: gap 20, p 20, r 8, заголовок 48 · 1440: gap 16, p 16, r 8, 32 ·
   1024: gap 14, p 12, r 6, 24 · 375: gap 9, r 4, 16, кнопка на всю ширину
   ========================================================================== */

.card-industry {
	--ci-gap: 20px;
	--ci-pad: 20px;
	--ci-radius: 8px;

	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"media"
		"title"
		"btn";
	row-gap: var(--ci-gap);
	justify-items: start;
	align-content: start;
}

.card-industry__media {
	position: relative;
	grid-area: media;
	width: 100%;
	aspect-ratio: 890 / 526;
	overflow: hidden;
	border-radius: var(--ci-radius);
	background-color: var(--c-grey);
}

.card-industry__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: linear-gradient(180deg, rgba(31, 33, 38, 0.48) 0%, rgba(31, 33, 38, 0.082) 38.942%, rgba(31, 33, 38, 0) 72.115%, rgba(31, 33, 38, 0) 100%);
	pointer-events: none;
}

.card-industry__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* кадрирование из макета: размеры и смещение — inline-стилем */
.card-industry__img.is-cropped {
	position: absolute;
	max-width: none;
	object-fit: fill;
}

.card-industry__tags {
	position: relative;
	z-index: 1;
	grid-area: media;
	align-self: start;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: var(--ci-pad);
}

.card-industry__tags--narrow {
	display: none;
}

.card-industry__title {
	grid-area: title;
	width: 100%;
	font-size: 48px;
	font-weight: 500;
	line-height: 1.1;
	color: #000;
}

.card-industry__btn {
	grid-area: btn;
}

@media (max-width: 1919.98px) {
	.card-industry {
		--ci-gap: 16px;
		--ci-pad: 16px;
	}

	.card-industry__tags {
		gap: 8px;
	}

	.card-industry__title {
		font-size: 32px;
		color: var(--c-black);
	}
}

@media (max-width: 1439.98px) {
	.card-industry {
		--ci-gap: 14px;
		--ci-pad: 12px;
		--ci-radius: 6px;
	}

	.card-industry__tags {
		gap: 6px;
	}

	.card-industry__title {
		font-size: 24px;
	}
}

@media (max-width: 1023.98px) {
	.card-industry {
		--ci-gap: 9px;
		--ci-radius: 4px;

		grid-template-rows: auto auto auto 1fr;
		grid-template-areas:
			"media"
			"title"
			"tags"
			"btn";
		justify-items: stretch;
		/* высота карточки в макете 375 */
		min-height: 236px;
	}

	.card-industry__tags--narrow {
		display: flex;
	}

	.card-industry__tags {
		grid-area: tags;
		gap: 4px;
		padding: 0;
	}

	.card-industry__title {
		font-size: 16px;
	}

	.card-industry__btn {
		align-self: end;
	}

	.card-industry__tags--wide {
		display: none;
	}
}