/*
 * Home — layout/placement only. Primitives live in components.css.
 * `.home` is WordPress's front-page body class.
 */

/* 1. Hero background image (contract: page CSS sets the bg only) */
.home .hero {
	background-image: url('../images/hero-home.jpg');
}

/* 2. Tiles card overlaps the hero bottom (.tiles is already z-index:2) */
.home-tiles {
	margin-top: clamp(-120px, -8vw, -64px);
}

/* 3. "Why Choose Us?" — blue centered title */
.home-why-title {
	color: var(--brand);
}

/* 4 + 5. Media/text splits (mission, who-we-are) */
.home-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(32px, 5vw, 64px);
	align-items: center;
}

.home-split__media img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 16px;
	box-shadow: 0 12px 34px rgba(4, 19, 42, .10);
}

.home-split--reverse .home-split__media {
	order: 2;
}

@media (max-width: 760px) {
	.home-split {
		grid-template-columns: 1fr;
	}

	.home-split--reverse .home-split__media {
		order: 0;
	}
}

/* 6. Services-list CTA */
.home-svc-cta {
	margin-top: 48px;
	text-align: center;
}