/* Порядок работы — Figma 63:17787 (mobile, 375px) */

@media (max-width: 576px) {
	body.main .steps {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 30px;
		padding: 32px 0;
		margin-left: -12px;
		margin-right: -12px;
		width: calc(100% + 24px);
		box-sizing: border-box;
		background: #fff;
		overflow: hidden;
	}

	body.main .steps__title {
		margin: 0;
		padding: 0 16px;
		font-family: 'Open Sans', sans-serif;
		font-size: 24px;
		font-weight: 600;
		line-height: 32px;
		color: #212529;
	}

	/* Frame 4773 — row, padding: 0, gap: 8px, height: 232px */
	body.main .steps-list {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: 8px;
		width: 100%;
		height: 256px;
		margin: 0;
		padding: 10px 0 0 16px;
		overflow-x: auto;
		overflow-y: visible;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		box-sizing: border-box;
	}

	body.main .steps-list::-webkit-scrollbar {
		display: none;
	}

	body.main .steps-list.owl-carousel,
	body.main .steps-list.owl-loaded {
		display: flex;
	}

	body.main .steps-list .owl-stage-outer,
	body.main .steps-list .owl-stage,
	body.main .steps-list .owl-item {
		display: contents;
	}

	/* Other cards / Service — 290×232, padding 16px, shadow */
	body.main .steps .step-item {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		flex: 0 0 290px;
		width: 290px;
		min-width: 290px;
		max-width: 290px;
		height: 232px;
		min-height: 232px;
		padding: 16px;
		gap: 16px;
		border: none;
		border-radius: 4px;
		background: #fff;
		box-shadow: 0 8px 20px 5px rgba(12, 12, 13, 0.05);
		box-sizing: border-box;
	}

	body.main .steps .step-item__count {
		flex: 0 0 auto;
		margin: 0;
		padding: 0;
		font-family: 'Open Sans', sans-serif;
		font-size: 32px;
		font-weight: 400;
		line-height: 40px;
		color: #AFAFAF;
		opacity: 0.8;
	}

	body.main .steps .step-item__caption {
		flex: 1 1 auto;
		margin: 0;
		padding: 0;
		font-family: 'Open Sans', sans-serif;
		font-size: 16px;
		font-weight: 400;
		line-height: 24px;
		color: #212529;
		opacity: 0.8;
		overflow: hidden;
	}

	body.main .steps .step-item:last-child {
		flex: 0 0 calc(100vw - 16px);
		width: calc(100vw - 16px);
		min-width: calc(100vw - 16px);
		max-width: calc(100vw - 16px);
	}
}
