/* ============================================================
   CAPABILITIES OVERVIEW PAGE — /services/
   Applied on the page with body class `vita-services`.
   Designed around the same section rhythm as the capability
   pages (--vita-cap-section-pad), but with its own colour
   tokens since it isn't tied to a single capability brand.
   ============================================================ */

body.vita-services {
	--vita-cap-section-pad: clamp(56px, 8vw, 80px);
	background: var(--wp--preset--color--background, #FFF8EE);
}

/* ── HERO ────────────────────────────────────────────────────── */

.vita-svc-hero {
	background: #1F3933; /* dark green — anchors the page */
	color: #ffffff;
	padding: clamp(56px, 9vw, 96px) clamp(20px, 5vw, 24px) var(--vita-cap-section-pad);
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 3vw, 32px);
}

.vita-svc-hero__eyebrow {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #ffffff;
	opacity: 0.7;
	margin: 0;
}

h1.wp-block-heading.vita-svc-hero__title {
	font-family: var(--wp--preset--font-family--sans), ui-sans-serif, system-ui, sans-serif;
	font-weight: 700;
	font-size: clamp(2.5rem, 8vw, 6.25rem);
	line-height: 1.0;
	letter-spacing: -0.028em;
	max-width: 18ch;
	color: #ffffff;
	margin: 0;
}

.vita-svc-hero__title em {
	font-family: var(--wp--preset--font-family--serif), ui-serif, Georgia, serif;
	font-style: italic;
	font-weight: 400;
}

.vita-svc-hero__lede {
	font-size: clamp(1rem, 2vw, 1.25rem);
	line-height: 1.55;
	max-width: 64ch;
	opacity: 0.86;
	margin: 0;
}

.vita-svc-hero__cta-row {
	display: flex;
	gap: 14px;
	align-items: center;
	flex-wrap: wrap;
}

.vita-svc-hero__cta-pill {
	background: #ffffff;
	color: #1F3933;
	padding: 14px 24px;
	border-radius: 999px;
	font-weight: 500;
	font-size: 15px;
	text-decoration: none;
	transition: transform .12s ease;
}

.vita-svc-hero__cta-pill:hover { transform: translateY(-1px); }

.vita-svc-hero__cta-ghost {
	color: #ffffff;
	opacity: .65;
	font-size: 12px;
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	text-transform: uppercase;
	letter-spacing: .1em;
	text-decoration: none;
	font-weight: 500;
}

/* ── INDUSTRIES STRIP ────────────────────────────────────────── */

.vita-svc-industries {
	padding: clamp(28px, 4vw, 40px) clamp(20px, 5vw, 24px);
	background: rgba(15, 27, 45, 0.04);
	border-bottom: 1px solid rgba(15, 27, 45, 0.06);
}

.vita-svc-industries__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 18px;
}

.vita-svc-industries__label {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(15, 27, 45, 0.55);
}

.vita-svc-industries__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.vita-svc-industries__list li {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 500;
	font-size: 13px;
	color: #0F1B2D;
	background: #ffffff;
	border: 1px solid rgba(15, 27, 45, 0.1);
	border-radius: 999px;
	padding: 6px 14px;
}

/* ── WHY NOW (cost-collapse) ─────────────────────────────────── */

.vita-svc-why {
	padding: var(--vita-cap-section-pad) clamp(20px, 5vw, 24px);
}

.vita-svc-why__grid {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 2.1fr) minmax(220px, 1fr);
	gap: clamp(28px, 4vw, 48px);
	align-items: start;
}

@media (max-width: 899.98px) {
	.vita-svc-why__grid { grid-template-columns: 1fr; }
}

.vita-svc-why__copy {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.vita-svc-why__eyebrow {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(15, 27, 45, 0.55);
}

.vita-svc-why__heading {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: #0F1B2D;
	margin: 0;
	max-width: 22ch;
}

.vita-svc-why__heading em {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-weight: 400;
}

.vita-svc-why__body {
	font-size: clamp(1rem, 1.8vw, 1.125rem);
	line-height: 1.55;
	color: rgba(15, 27, 45, 0.82);
	max-width: 62ch;
	margin: 0;
}

.vita-svc-why__stat {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 28px 24px;
	background: #1F3933;
	color: #ffffff;
	border-radius: 18px;
	min-height: 200px;
	justify-content: center;
}

.vita-svc-why__stat-num {
	font-family: var(--wp--preset--font-family--serif), ui-serif, Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: clamp(3.5rem, 8vw, 5.5rem);
	line-height: 1.0;
	letter-spacing: -0.02em;
	color: #6BE0B8;
}

.vita-svc-why__stat-lbl {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 13px;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.78);
}

/* ── FIVE CAPABILITIES GRID ──────────────────────────────────── */

.vita-svc-caps {
	padding: var(--vita-cap-section-pad) clamp(20px, 5vw, 24px);
	background: rgba(15, 27, 45, 0.035);
}

.vita-svc-caps__head {
	max-width: 1200px;
	margin: 0 auto clamp(28px, 4vw, 40px);
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.vita-svc-caps__eyebrow {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(15, 27, 45, 0.55);
}

.vita-svc-caps__heading {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: #0F1B2D;
	margin: 0;
	max-width: 22ch;
}

.vita-svc-caps__heading em {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-weight: 400;
}

.vita-svc-caps__lede {
	font-size: 15px;
	line-height: 1.55;
	color: rgba(15, 27, 45, 0.7);
	max-width: 56ch;
	margin: 0;
}

.vita-svc-caps__grid {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}

.vita-svc-cap {
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: #ffffff;
	border-radius: 14px;
	padding: 22px 22px 24px;
	text-decoration: none;
	color: #0F1B2D;
	border: 1px solid rgba(15, 27, 45, 0.06);
	box-shadow: 0 1px 0 rgba(15, 27, 45, 0.04);
	transition: transform 120ms ease, box-shadow 120ms ease;
}

.vita-svc-cap:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(15, 27, 45, 0.08);
}

.vita-svc-cap__swatch {
	width: 32px;
	height: 32px;
	border-radius: 8px;
}

.vita-svc-cap__swatch--operations { background: #1F3933; }
.vita-svc-cap__swatch--reporting  { background: #FF8847; }
.vita-svc-cap__swatch--scheduling { background: #6B9DFF; }
.vita-svc-cap__swatch--quoting    { background: #6BE0B8; }
.vita-svc-cap__swatch--ipdata     { background: #0F1B2D; }
.vita-svc-cap__swatch--ai-agents  { background: #5A3F8C; }

.vita-svc-cap__name {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: 1.125rem;
	letter-spacing: -0.015em;
	color: #0F1B2D;
	margin: 0;
}

.vita-svc-cap__lede {
	font-size: 14px;
	line-height: 1.55;
	color: rgba(15, 27, 45, 0.7);
	margin: 0;
	flex: 1 1 auto;
}

.vita-svc-cap__cta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #0F1B2D;
	margin-top: 6px;
}

/* ── HOW WE WORK ─────────────────────────────────────────────── */

.vita-svc-how {
	padding: var(--vita-cap-section-pad) clamp(20px, 5vw, 24px);
}

.vita-svc-how__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: clamp(28px, 4vw, 40px);
}

.vita-svc-how__eyebrow {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(15, 27, 45, 0.55);
}

.vita-svc-how__heading {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: #0F1B2D;
	margin: 0;
	max-width: 24ch;
}

.vita-svc-how__heading em {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-weight: 400;
}

.vita-svc-how__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}

.vita-svc-how__card {
	background: rgba(15, 27, 45, 0.04);
	border-radius: 14px;
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.vita-svc-how__card strong {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: 1.0625rem;
	letter-spacing: -0.01em;
	color: #0F1B2D;
}

.vita-svc-how__card p {
	font-size: 14px;
	line-height: 1.55;
	color: rgba(15, 27, 45, 0.75);
	margin: 0;
}