/*
 * Services archive (Figma group 07: D-EN 7:11844, M-EN 5:6531, D-AR 5:6214, M-AR 41:35265).
 * Mobile-first: base = 390 frame, >=1024px = 1440 frame. RTL mirrors through dir="rtl"; the places
 * where an AR frame is not a mirror have explicit [dir="rtl"] rules (commented).
 */

/* ---------- S1 hero (7:11871 / 5:6542 / 5:6241 / 41:35276) ---------- */
.tec-services__hero { padding-top: 4px; }
.tec-services__hero-top { display: flex; flex-direction: column; }
.tec-services__title {
	font-size: 30px;
	font-weight: 800;
	line-height: 40.5px;
	color: var(--tec-navy);
	text-align: start;
}
.tec-services__intro {
	padding-top: 12px;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 23.63px;
	color: var(--tec-grey);
	text-align: start;
}
.tec-services__hero-media { display: flex; padding-top: 18px; }
.tec-services__hero-b { position: relative; width: 100%; padding-top: 36px; }
.tec-services__hero-img { height: 250px; border-radius: 16px; }
/* M-EN Arrow 35:34623 at (228,-6) of the 350 container: 38px from its right edge. */
.tec-services__badge { position: absolute; top: -6px; right: 38px; }
/* M-AR Arrow 41:35549 at (24,0): not a mirror of M-EN (38 / -6), so explicit. */
[dir="rtl"] .tec-services__badge { top: 0; right: auto; left: 24px; }

/* ---------- S2 Our Services (7:11902 / 5:6568 / 5:6272 / 41:35302) ---------- */
.tec-services__services { padding-top: 64px; }
.tec-services__services-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding-bottom: 24px;
}
.tec-services__h2 {
	font-size: 28px;
	font-weight: 800;
	line-height: 37.8px;
	color: var(--tec-navy);
}
.tec-services__h2--center { text-align: center; }
.tec-services__lead {
	width: 100%;
	font-size: 14px;
	font-weight: 400;
	line-height: 24.5px;
	color: var(--tec-grey);
	text-align: center;
}
.tec-services__cards { display: flex; flex-direction: column; gap: 14px; }
.tec-services__card {
	position: relative;
	display: block;
	height: 340px;
	border-radius: 16px;
	overflow: hidden;
	isolation: isolate;
	color: var(--tec-white);
}
.tec-services__card-media { position: absolute; inset: 0; overflow: hidden; background: var(--tec-placeholder); }
.tec-services__shade { position: absolute; inset: 0; }
/* M-EN card 1: IMAGE-SVG 5:6584, 350x276 at y 64.2. */
.tec-services__shade--a { top: auto; height: 276px; background: linear-gradient(0deg, rgba(11, 34, 56, 0.85) 14%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%); }
/* M-EN card 2: 41:36872. */
.tec-services__shade--b { background: linear-gradient(1deg, rgba(11, 34, 56, 0.85) 2%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%); }
/* M-AR cards: 41:36899 / 41:36901. */
.tec-services__shade--c { background: linear-gradient(0deg, rgba(11, 34, 56, 0.85) 14%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%); }
.tec-services__card-icon {
	position: absolute;
	z-index: 1;
	top: 20px;
	inset-inline-end: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 22px;
	background: var(--tec-green);
}
/* M-AR card 2: the gradient layer is above the icon circle in the layer order. */
.tec-services__shade--over { z-index: 2; }
.tec-services__card-body {
	position: absolute;
	z-index: 3;
	top: 188.75px;
	inset-inline: 20px;
}
.tec-services__card--en1 .tec-services__card-body { top: 118.58px; }
.tec-services__card--en2 .tec-services__card-body { top: 185.2px; }
.tec-services__card-title {
	font-size: 22px;
	font-weight: 700;
	line-height: 29.7px;
	color: var(--tec-white);
	text-align: start;
}
.tec-services__card-list {
	display: flex;
	flex-direction: column;
	padding-top: 8px;
	padding-inline-start: 18px;
}
.tec-services__card-list li {
	position: relative;
	font-size: 13px;
	font-weight: 400;
	line-height: 23.4px;
	color: var(--tec-white);
}
/* EN bullets: separate "•" nodes at x -11 (mobile, SemiBold) / -10 (desktop, Regular). */
.tec-services__card-list li::before {
	content: "\2022";
	position: absolute;
	top: 0;
	left: -11px;
	font-weight: 600;
}
/* AR lists have no bullet nodes: each item is text beginning with "  - " (kept verbatim). */
[dir="rtl"] .tec-services__card-list { align-items: flex-start; padding-inline-start: 0; }
[dir="rtl"] .tec-services__card-list li { white-space: pre-wrap; }
[dir="rtl"] .tec-services__card-list li::before { content: none; }

/* ---------- S3 Our Specialties (7:11964 / 5:6630 / 5:6334 / 41:35364) ---------- */
.tec-services__specialties { padding-top: 60px; }
.tec-services__spec-head { display: flex; flex-direction: column; align-items: flex-start; }
.tec-services__h2--spec,
.tec-services__h2--str { width: 100%; text-align: start; }
.tec-services__h2--spec { padding: 12px 0 22px; }
.tec-services__spec-cards { display: flex; gap: 14px; }
.tec-services__spec {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	height: 200px;
	border-radius: 16px;
	overflow: hidden;
	isolation: isolate;
}
.tec-services__spec-shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(11, 34, 56, 0.85) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%);
}
/* M-AR overlays 41:36905 / 41:36903 use 0.82. */
[dir="rtl"] .tec-services__spec-shade { background: linear-gradient(0deg, rgba(11, 34, 56, 0.82) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%); }
.tec-services__spec-icon {
	position: absolute;
	z-index: 1;
	top: 16px;
	inset-inline-end: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 19px;
	background: var(--tec-navy);
}
.tec-services__spec-title {
	position: absolute;
	z-index: 1;
	top: 159.7px;
	inset-inline: 16px;
	font-size: 18px;
	font-weight: 700;
	line-height: 24.3px;
	color: var(--tec-white);
	text-align: start;
}

/* ---------- S4 tagline strip (137:36676 / 137:36681 / 137:36685 / 137:36690) ---------- */
.tec-services__tagline { padding-top: 50px; overflow: hidden; }

/* ---------- S5 Why Technical Excellence (7:12000 / 5:6663 / 5:6370 / 41:35397) ---------- */
.tec-services__strengths { padding-top: 50px; }
.tec-services__str-head { display: flex; flex-direction: column; align-items: flex-start; }
.tec-services__h2--str { padding: 12px 0 24px; }
.tec-services__str-cards { display: flex; flex-direction: column; gap: 14px; }
.tec-services__str {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 22px 20px;
	border: 1px solid var(--tec-border);
	border-radius: 16px;
	background: var(--tec-white);
}
.tec-services__str-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 24.3px;
	color: var(--tec-navy);
	text-align: start;
}
.tec-services__str-text {
	width: 100%;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 24.3px;
	color: var(--tec-grey);
	text-align: start;
}

/* ---------- S6 CTA banner (7:12051 / 41:40269 / 5:6421 / 41:35446) ---------- */
.tec-services__cta-wrap { padding-top: 60px; }
.tec-services__cta { position: relative; height: 400px; isolation: isolate; }
.tec-services__cta-media { position: absolute; inset: 0; overflow: hidden; border-radius: 20px; background: var(--tec-placeholder); }
/* M-EN overlay 41:40272 has radius 24px over a 20px image (summary Unknown 8), kept as designed. */
.tec-services__cta-shade {
	position: absolute;
	inset: 0;
	border-radius: 24px;
	background: linear-gradient(180deg, rgba(11, 34, 56, 0.85) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%);
}
/* M-AR: overlay 41:36907 runs bottom-up and the text sits low in the card (not a mirror of M-EN). */
[dir="rtl"] .tec-services__cta-shade {
	border-radius: 20px;
	background: linear-gradient(0deg, rgba(11, 34, 56, 0.85) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%);
}
.tec-services__cta-content {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 11px;
	padding: 51px 22px 0;
}
[dir="rtl"] .tec-services__cta-content { padding-top: 158.92px; }
.tec-services__cta-title {
	align-self: stretch;
	font-size: 26px;
	font-weight: 800;
	line-height: 35.1px;
	color: var(--tec-white);
	text-align: start;
}
.tec-services__cta-text {
	font-size: 13.5px;
	font-weight: 400;
	line-height: 24.3px;
	color: var(--tec-white);
	text-align: start;
}

.tec-services__spacer { height: 60px; }

/* ================= Desktop (1440 frame) ================= */
@media (min-width: 1024px) {
	/* S1 */
	.tec-services__hero { padding-top: 10px; }
	.tec-services__hero-top { flex-direction: row; justify-content: space-between; }
	.tec-services__hero-head { flex: 0 1 880px; min-width: 0; }
	[dir="rtl"] .tec-services__hero-head { flex-basis: 686px; }
	.tec-services__title { font-size: 56px; line-height: 75.6px; }
	.tec-services__intro { flex: 0 0 280px; width: 280px; padding-top: 18px; }
	.tec-services__hero-media { flex-direction: row; align-items: flex-end; gap: 34px; padding-top: 36px; }
	/* D-AR keeps image A on the left and B on the right (5:6256 is not mirrored). */
	[dir="rtl"] .tec-services__hero-media { flex-direction: row-reverse; }
	.tec-services__hero-a { flex: 0 1 480px; min-width: 0; height: 400px; border-radius: 18px; }
	.tec-services__hero-b { flex: 0 1 686px; min-width: 0; padding-top: 44px; }
	.tec-services__hero-img { height: 356px; border-radius: 18px; }
	/* Arrow 35:34603 at (516,0) of the 686 column (70px from its right); D-AR 35:34612 at (70,0). */
	.tec-services__badge { top: 0; right: 70px; left: auto; }
	[dir="rtl"] .tec-services__badge { top: 0; right: auto; left: 70px; }

	/* S2 */
	.tec-services__services { padding-top: 110px; }
	.tec-services__services-head { gap: 14px; padding-bottom: 40px; }
	.tec-services__h2 { font-size: 42px; line-height: 56.7px; }
	.tec-services__lead { width: 540px; max-width: 100%; }
	.tec-services__cards { flex-direction: row; gap: 22px; }
	.tec-services__card-item { flex: 1 1 0; min-width: 0; }
	.tec-services__card { height: 420px; border-radius: 18px; }
	.tec-services__shade,
	.tec-services__shade--a,
	.tec-services__shade--b,
	.tec-services__shade--c {
		top: 0;
		height: auto;
		background: linear-gradient(0deg, rgba(11, 34, 56, 0.82) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%);
	}
	.tec-services__shade--over { z-index: auto; }
	.tec-services__card-icon { top: 30px; inset-inline-end: 30px; width: 46px; height: 46px; border-radius: 23px; }
	.tec-services__card-body,
	.tec-services__card--en1 .tec-services__card-body,
	.tec-services__card--en2 .tec-services__card-body { top: 220.02px; inset-inline: 30px; }
	.tec-services__card-title { font-size: 28px; line-height: 37.8px; }
	/* D-AR titles: lh 29.7px inside a 37.8px frame, text at y 3.78. */
	[dir="rtl"] .tec-services__card-title { height: 37.8px; padding-top: 3.78px; line-height: 29.7px; }
	.tec-services__card-list { padding-top: 12px; }
	.tec-services__card-list li { min-height: 31px; padding-top: 4px; font-size: 14px; line-height: 26.6px; }
	.tec-services__card-list li::before { left: -10px; font-weight: 400; }
	[dir="rtl"] .tec-services__card-list { gap: 8px; }
	[dir="rtl"] .tec-services__card-list li { min-height: 0; padding-top: 0; font-size: 13px; line-height: 23.4px; }

	/* S3 */
	.tec-services__specialties { padding-top: 90px; }
	.tec-services__spec-head { gap: 14px; padding-bottom: 36px; }
	.tec-services__h2--spec { padding: 0; }
	.tec-services__spec-cards { gap: 22px; }
	.tec-services__spec { height: 320px; border-radius: 18px; }
	.tec-services__spec-shade,
	[dir="rtl"] .tec-services__spec-shade { background: linear-gradient(0deg, rgba(11, 34, 56, 0.82) 0%, rgba(11, 34, 56, 0) 100%, rgba(11, 34, 56, 0) 100%); }
	.tec-services__spec-icon { top: 26px; inset-inline-end: 26px; }
	.tec-services__spec-title { top: 258.91px; inset-inline: 26px; font-size: 26px; line-height: 35.1px; }

	/* S4 */
	.tec-services__tagline { padding-top: 90px; }

	/* S5 */
	.tec-services__strengths { padding-top: 90px; }
	.tec-services__str-head { gap: 14px; padding-bottom: 36px; }
	.tec-services__h2--str { padding: 0; }
	.tec-services__str-cards { flex-direction: row; align-items: flex-start; gap: 18px; }
	.tec-services__str { flex: 1 1 0; min-width: 0; gap: 10px; padding: 26px 22px; border-radius: 18px; }
	.tec-services__str-title { font-size: 19px; line-height: 25.65px; }

	/* S6 */
	.tec-services__cta-wrap { padding-top: 110px; }
	.tec-services__cta { height: 360px; }
	.tec-services__cta-media { border-radius: 24px; }
	/* D-AR overlay 41:36760 keeps the EN 90deg direction (not flipped), as designed. */
	.tec-services__cta-shade,
	[dir="rtl"] .tec-services__cta-shade {
		border-radius: 24px;
		background: linear-gradient(90deg, rgba(11, 34, 56, 0.8) 0%, rgba(11, 34, 56, 0.1) 75%, rgba(11, 34, 56, 0.1) 100%);
	}
	.tec-services__cta-content { gap: 14px; padding: 56.36px 56px 0; }
	/* D-AR content 41:36761 at y 92.36 has no cross-axis alignment, so the paragraph box and the
	   button sit on the left; only the full-width heading is right-aligned. Not a mirror. */
	[dir="rtl"] .tec-services__cta-content { align-items: flex-end; padding-top: 92.36px; }
	.tec-services__cta-title { font-size: 38px; line-height: 51.3px; }
	.tec-services__cta-text { width: 520px; max-width: 100%; font-size: 14px; line-height: 25.9px; }

	.tec-services__spacer { height: 110px; }
}
