/*
 * FULFIT — Интернет-магазины: блок «услуги-процесс»
 *
 * Часть разделённого main.css (был 11103 строки, 79% из них не
 * использовались на конкретной странице). Файл собран из целых секций
 * исходника БЕЗ изменения их порядка и содержимого.
 *
 * Подключается: страница 12 (/internet-magaziny/)
 * Правится вручную, как обычный CSS. Общие для всех страниц стили —
 * в main-core.css; секции ищите по прежним баннерам-комментариям.
 */

/* =======================================================================
   УСЛУГИ-ПРОЦЕСС (.ff-process) - новый блок лендинга Интернет-магазин:
   статичная сетка 6 нумерованных карточек (01-06). Фиолетовая палитра
   через var(--mp-accent). Figma node 1:3973 (Frame 2539).
   ======================================================================= */
.ff-process { margin-top: clamp(50px, 38.46px + 3.2051vw, 100px); }
.ff-process__title {
	margin: 0 0 clamp(28px, 20px + 2.22vw, 60px);
	color: #1A1A2E;
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 600;
	font-size: clamp(1.75rem, 1.3rem + 2vw, 2.5rem);
	line-height: 1.2;
	text-align: center;
}
.ff-process__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}
/* Owl-фикс (см. шапку файла): core тянет margin-block-start: 24px карточкам
   2+, сдвигая их ниже первой в ряду при align-items:stretch. Тай по
   специфичности с core-правилом — нужен !important (тот же приём, что и в
   общем owl-сбросе выше). */
.ff-process__grid > * { margin-block-start: 0 !important; }
.ff-process__card {
	background: var(--mp-card, #F6F5FC);
	border-radius: 20px;
	padding: 32px 30px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ff-process__num {
	margin: 0;
	color: var(--mp-accent, #6C37D6);
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 600;
	font-size: 2.5rem;
	line-height: 1;
}
.ff-process__card-title {
	margin: 0;
	color: #1A1A2E;
	font-family: var(--wp--preset--font-family--plus-jakarta-sans);
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1.4;
}
.ff-process__card-desc {
	margin: 0;
	color: #524A70;
	font-size: 1rem;
	line-height: 1.5;
}
@media (max-width: 1024px) {
	.ff-process__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 640px) {
	.ff-process__grid {
		display: flex;
		grid-template-columns: none;
		gap: 12px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		min-width: 0;
	}
	.ff-process__grid::-webkit-scrollbar { display: none; }
	.ff-process__card { flex: 0 0 270px; min-width: 0; scroll-snap-align: start; }
}