/*
 * Home process — DARK.
 */

.ss-home-process {
	padding-block: clamp(82px, 9vw, 138px);
	background: var(--ss-graphite);
	color: var(--ss-ivory);
}

.ss-home-process .ss-home-eyebrow {
	color: #c9a3b0;
}

.ss-home-process__head {
	max-width: 900px;
	margin-bottom: clamp(44px, 6vw, 80px);
}

.ss-home-process__head h2 {
	max-width: 13ch;
	margin: 0;
	color: var(--ss-ivory);
	font-size: clamp(3rem, 5vw, 5.6rem);
	letter-spacing: -0.05em;
	line-height: 0.96;
}

.ss-process-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: 1px solid var(--ss-border-light);
	border-bottom: 1px solid var(--ss-border-light);
}

.ss-process-step {
	min-width: 0;
	padding: 28px 26px 34px;
	border-right: 1px solid var(--ss-border-light);
}

.ss-process-step:first-child {
	padding-left: 0;
}

.ss-process-step:last-child {
	padding-right: 0;
	border-right: 0;
}

.ss-process-step__number {
	display: block;
	margin-bottom: 46px;
	color: #c9a3b0;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
}

.ss-process-step h3 {
	margin: 0 0 12px;
	color: var(--ss-ivory);
	font-size: clamp(1.25rem, 1.8vw, 1.65rem);
	letter-spacing: -0.03em;
}

.ss-process-step p {
	margin: 0;
	color: #d8d2cc;
	font-size: 0.9375rem;
	line-height: 1.65;
}

@media (max-width: 899px) {
	.ss-process-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ss-process-step:nth-child(2) {
		border-right: 0;
	}

	.ss-process-step:nth-child(-n+2) {
		border-bottom: 1px solid var(--ss-border-light);
	}
}

@media (max-width: 689px) {
	.ss-process-grid {
		grid-template-columns: 1fr;
	}

	.ss-process-step,
	.ss-process-step:first-child,
	.ss-process-step:last-child {
		padding: 24px 0 28px;
		border-right: 0;
		border-bottom: 1px solid var(--ss-border-light);
	}

	.ss-process-step:last-child {
		border-bottom: 0;
	}

	.ss-process-step__number {
		margin-bottom: 18px;
	}
}