/* ==========================================================================
   Bonaventure Portfolio — bv-process-steps.css
   BV Process Steps widget. Flush Nexcess Edge CDN after updating.
   Numbered steps connected by a hairline rule. Defaults match house style.
   ========================================================================== */

.bvps-wrap {
	width: 100%;
}

.bvps-grid {
	display: grid;
	grid-template-columns: repeat(var(--bvps-cols, 4), 1fr);
	column-gap: 20px;
	row-gap: 36px;
	position: relative;
	max-width: 980px;
	margin: 0 auto;
}

/* Connector line behind the number circles */
.bvps-grid--line::before {
	content: '';
	position: absolute;
	top: 28px;                 /* aligns to vertical centre of a 56px circle */
	left: 12%;
	right: 12%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(220, 176, 100, 0.4), transparent);
	pointer-events: none;
	z-index: 0;
}

.bvps-step {
	text-align: center;
	position: relative;
	z-index: 1;
}

.bvps-num {
	width: 56px;
	height: 56px;
	background: #ffffff;
	border: 1.5px solid #DCB064;
	color: #DCB064;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "scotch-text", Georgia, serif;
	font-size: 22px;
	line-height: 1;
	margin: 0 auto 20px;
	position: relative;
	z-index: 1;
	box-shadow: 0 6px 20px rgba(220, 176, 100, 0.15);
}

.bvps-title {
	font-family: "scotch-text", Georgia, serif;
	font-size: 18px;
	font-weight: 400;
	color: #26262D;
	line-height: 1.25;
	margin: 0 0 9px;
}

.bvps-desc {
	font-size: 13.5px;
	color: #8a8a8f;
	line-height: 1.65;
	font-weight: 300;
	margin: 0;
	padding: 0 6px;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 880px) {
	.bvps-grid {
		grid-template-columns: repeat(2, 1fr);
		row-gap: 36px;
	}
	/* Connector line spans rows awkwardly once wrapped — hide it. */
	.bvps-grid--line::before {
		display: none;
	}
}

@media (max-width: 480px) {
	.bvps-grid {
		grid-template-columns: 1fr;
	}
}