/**
 * Deliverables — "What's Included" card menu on bg2. Narrow centered column.
 * Typography via utilities; layout/spacing/decoration here.
 */

.flexible-section.deliverables {
	padding-block: var(--section-pad-y);
	padding-inline: var(--section-pad-x);
	background: var(--color-bg2);
}

.deliverables-in {
	max-width: var(--container-narrow);
	margin-inline: auto;
}

.deliverables-head {
	margin-block-end: clamp(30px, 1.61vw + 24.2px, 55px);
}

.deliverables-title {
	margin: clamp(4px, 0.24vw + 3px, 7.5px) 0 clamp(8px, 0.4vw + 6px, 15px);
	line-height: 1.15;
}

.deliverables-sub {
	max-width: 800px;
}

.deliverables-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(14px, 0.55vw + 11px, 22.5px);
}

.deliv-card {
	position: relative;
	overflow: hidden;
	padding: clamp(22px, 0.84vw + 18.9px, 32.5px) clamp(20px, 0.77vw + 17.2px, 30px);
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: 10px;
}

.deliv-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--color-navy), var(--color-gold2));
}

.deliv-card .c-ey {
	margin-block-end: clamp(8px, 0.32vw + 6.9px, 12.5px);
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.deliv-card h3 {
	margin-block-end: clamp(7px, 0.24vw + 6px, 10px);
	line-height: 1.3;
}

@media (max-width: 900px) {
	.deliverables-grid { grid-template-columns: repeat(2, 1fr); }
}

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