/* ==========================================================================
   SkyTrade Aviation — Homepage
   Loaded only on the front page (see inc/enqueue.php).
   ========================================================================== */

/* ---- Hero ---- */
.home-hero {
	position: relative;
	min-height: 92vh;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}

.home-hero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.home-hero__bg-img,
.home-hero__bg .skytrade-img-placeholder {
	width: 100%;
	height: 100%;
	min-height: 92vh;
}

.home-hero__content {
	position: relative;
	z-index: 1;
	padding-bottom: var(--st-space-3xl);
	max-width: 720px;
}

.home-hero__headline {
	font-size: 44px;
	margin-top: var(--st-space-sm);
}

@media (min-width: 720px) {
	.home-hero__headline {
		font-size: var(--st-text-display-large-size);
	}
}

.home-hero__subhead {
	color: var(--st-white-90);
	font-size: 17px;
	max-width: 560px;
}

.home-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--st-space-sm);
	margin: var(--st-space-lg) 0;
}

.home-hero__trust {
	color: var(--st-white-60);
	font-size: 12px;
	letter-spacing: 0.05em;
}

/* ---- Split sections (photo + text, alternating) ---- */
.split-section {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--st-space-xl);
	align-items: center;
}

@media (min-width: 900px) {
	.split-section {
		grid-template-columns: 1fr 1fr;
	}
	.split-section--reverse .split-section__media {
		order: 2;
	}
	.split-section--reverse .split-section__content {
		order: 1;
	}
}

.split-section__media {
	aspect-ratio: 4 / 3;
	border-radius: var(--st-radius-card);
	overflow: hidden;
}

.split-section__media .skytrade-img,
.split-section__media .skytrade-img-placeholder {
	width: 100%;
	height: 100%;
}

/* ---- Checklist (Why SkyTrade section) ---- */
.checklist {
	list-style: none;
	padding: 0;
	margin: var(--st-space-lg) 0 0;
	display: flex;
	flex-direction: column;
	gap: var(--st-space-sm);
}

.checklist li {
	padding-left: var(--st-space-lg);
	position: relative;
	color: var(--st-white-90);
	font-size: 14px;
}

.checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 8px;
	height: 8px;
	background-color: var(--st-gold);
	border-radius: 50%;
}

/* ---- Benefit grid (2x2, inside Benefits Deep-Dive section) ---- */
.benefit-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--st-space-lg);
	margin-top: var(--st-space-lg);
}

@media (min-width: 560px) {
	.benefit-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.benefit-block h4 {
	color: var(--st-gold);
	font-size: 15px;
	margin-bottom: 4px;
}

.benefit-block p {
	font-size: 13px;
	margin-bottom: 0;
}

/* ---- Section heading (eyebrow + h2, centered, used before grids) ---- */
.section-heading {
	text-align: center;
	max-width: 640px;
	margin: 0 auto var(--st-space-xl);
}

.section-cta {
	text-align: center;
	margin-top: var(--st-space-xl);
}

/* ---- Tours ---- */
.tour-meta {
	color: var(--st-white-60);
	font-size: 12px;
	margin-bottom: var(--st-space-sm);
}

/* ---- Final CTA band ---- */
.home-final-cta {
	background-color: var(--st-gold);
	color: var(--st-navy);
}

.home-final-cta h2 {
	color: var(--st-navy);
}

.home-final-cta p {
	color: var(--st-navy);
	opacity: 0.8;
	margin-bottom: var(--st-space-lg);
}
