/**
 * OSHIDA — services / intro.
 *
 * @figma 1549:412  «خدمات متمایزکننده اوشیدا چیست؟» — 661 x 65 at (390, 1131.10).
 * @figma 1549:410  lede — 615.69 x 66 at (422.78, 1206.76): two lines, 33px each.
 *
 * The word-mark above ends at y=993.48 and this heading starts at y=1131.10,
 * so the section carries 137.62px of lead-in. It sits ON the arch, which runs
 * to y=1497.86, hence the raised stacking position.
 *
 * Owner: work package C3.
 */

.o-services-intro {
	position: relative;
	z-index: var(--o-z-raised);
	padding-block-start: clamp(48px, 9.56vw, 138px);
	text-align: center;
}

/*
 * CROSS-REQUEST to A1: this heading measures ~44px, not the 36px --o-fs-h1
 * measured on the home section heading (1601:2100). Measured off
 * services-1440.webp by comparing the «خد» ink cluster with the known 32px
 * service-card title (1579:1069): 55px wide here against 39px there. Swap this
 * local property for a real --o-fs-display token when A1 adds one.
 */
.o-services-intro__heading {
	--o-services-fs-display: clamp(28px, 3.06vw, 44px);

	gap: var(--o-space-3xs);
	align-items: center;
}

.o-services-intro__heading .o-section-heading__title {
	font-size: var(--o-services-fs-display);
	line-height: 1.477; /* 65 / 44 — the measured line box of 1549:412. */
	letter-spacing: var(--o-track-snug);
}

.o-services-intro__heading .o-section-heading__lede {
	max-inline-size: 616px;
	font-size: var(--o-fs-sm);
	line-height: var(--o-lh-body); /* 17 x 1.944 = 33.05px, the measured leading. */
	color: var(--o-text);
}

@media (max-width: 599px) {
	.o-services-intro__heading .o-section-heading__lede {
		max-inline-size: none;
	}
}