/* ── Section ─────────────────────────────────────────────── */
.section-hero-landing-page {
	padding-block: 0;
	background-color: transparent;
	position: relative;
	overflow-x: clip;
	z-index: 1; /* stacking context so shape paints above subsequent sections */
}

/* Container carries padding + gridlines (mirrors homepage banner pattern) */
.section-hero-landing-page > .container {
	padding-block: var(--size-pad-sm) var(--size-v-pad-lg);
}

/* Decorative strike — same image and positioning as homepage banner;
   height exceeds section so it bleeds into the next section. */
.section-hero-landing-page .shape-strike-yellow {
	position: absolute;
	right: -2%;
	top: -15vh;
	height: 112vh;
	max-height: 75rem;
	width: auto;
	z-index: 0;
	pointer-events: none;
	will-change: transform;
}

/* ── Grid ────────────────────────────────────────────────── */
.section-hero-landing-page .sph-grid {
	gap: var(--size-pad-xl);
	align-items: stretch;
	position: relative;
	z-index: 1;
}

/* ── Text column overrides ──────────────────────────────── */
.section-hero-landing-page .hero-col-text {
	justify-content: center;
	max-width: 60ch;
}

/* Reset breadcrumb bottom margin — hero manages its own gap */
.section-hero-landing-page .breadcrumb {
	margin-bottom: 0;
}

/* Logo bar + trust text: match section-content inset from homepage banner */
.section-hero-landing-page .hero-logos {
	padding-inline: var(--size-global-padding-h);
}

/* Description color override */
.section-hero-landing-page .hero-desc {
	color: var(--color-text-pri-dark);
}

/* ── Hero image ─────────────────────────────────────────── */
.sph-image {
	border-radius: var(--radius-media);
	border: var(--size-border-card-border) solid var(--color-border-light-100);
	overflow: hidden;
	height: 70vh;
	min-height: 500px;
	max-height: 720px;
}

.sph-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
}


/* Hero is a distinct visual block — no separator line before the next section */
.section-hero-landing-page + [class^="section-"],
.section-hero-landing-page + [class*=" section-"] {
	border-top: none;
}

/* ── Responsive ──────────────────────────────────────────── */
@media only screen and (max-width: 991.98px) {
	.section-hero-landing-page .shape-strike-yellow {
		display: none;
	}

	.section-hero-landing-page > .container {
		padding-block-start: 0;
		padding-block-end: var(--size-pad-xs);
	}

	.section-hero-landing-page .hero-col-text {
		justify-content: flex-start;
		padding-bottom: 0;
		max-width: 100%;
	}

	.section-hero-landing-page .sph-grid {
		gap: var(--size-pad-sm);
	}

	.sph-image {
		height: 72vw;
		min-height: 320px;
		max-height: 560px;
	}

	/* Flex-column wrapper; gap matches homepage parent grid row-gap */
	.section-hero-landing-page .hero-logos {
		display: flex;
		flex-direction: column;
		gap: var(--size-pad-xs);
		padding-inline: 0;
		margin-top: var(--size-pad-xs);
	}

	/* Scatter trust-row children into the flex column */
	.section-hero-landing-page .banner-trust-row {
		display: contents;
	}

	/* 1 — Trust text above logos */
	.section-hero-landing-page .banner-trust-text {
		display: inline;
		order: 1;
		padding-inline: var(--size-global-padding-h);
		margin-bottom: -1rem;
	}

	/* 2 — Logo grid wrapper — strip inherited outer border */
	.section-hero-landing-page .logo-bar {
		order: 2;
		border: none;
		border-radius: 0;
		padding: 0;
		padding-inline: var(--size-global-padding-h);
		background-color: transparent;
	}

	/* Logo grid — 3 columns, matching homepage */
	.section-hero-landing-page .hero-logos-grid {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		gap: 0.5rem;
		min-width: 0;
	}

	/* Logo items — bordered cards, matching homepage */
	.section-hero-landing-page .hero-logo-item {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 3.5rem;
		overflow: hidden;
		border: 1px solid var(--color-border-light-100);
		border-radius: var(--radius-btn);
		min-width: 0;
	}

	.section-hero-landing-page .hero-logo-item img {
		max-width: 100%;
		width: 100%;
		min-height: 3.3rem;
		object-fit: contain;
		padding-block: 0.5rem;
	}

	.section-hero-landing-page .hero-logo-item:nth-child(n+10) {
		display: none;
	}

	/* 3 — Case studies link as full-width secondary button below logos */
	.section-hero-landing-page .banner-cs-link {
		order: 3;
		display: flex;
		width: auto;
		align-items: center;
		justify-content: center;
		margin-inline: var(--size-global-padding-h);
		border-radius: var(--radius-btn);
		padding-block: var(--btn-pad-v);
		padding-inline: var(--btn-pad-h);
		font-size: var(--fs-button);
		font-weight: var(--fw-semibold);
		line-height: 1;
		letter-spacing: var(--ls-md);
		text-decoration: none !important;
		border: var(--size-border-button-border) solid var(--color-border-button-sec);
		background-color: var(--color-bg-button-sec);
		color: var(--color-text-pri-dark);
	}
}