/* --------------------------------------------------------------------------
   Compact homepage top (index-v2.php)
   Shorter hero so the three offer boxes sit in the first screen.
   Loaded after home.css; everything scoped to .home--compact.
   -------------------------------------------------------------------------- */

.home--compact .hero { min-height: 0; }

.home--compact .hero__inner {
	padding-top: calc(var(--announce-h) + 104px);
	padding-bottom: 28px;
}

.home--compact .hero__copy { margin-bottom: 22px; }
.home--compact .hero__eyebrow { margin-bottom: 12px; }
.home--compact .hero__title { font-size: clamp(2.8rem, 5.6vw, 5.4rem); }
.home--compact .hero__lead { margin-top: 12px; font-size: clamp(16px, 1.2vw, 18px); }

/* --------------------------------------------------------------------------
   Offers straight under the hero
   Photo on top (3:2, shown whole), solid green panel underneath
   -------------------------------------------------------------------------- */

.home--compact .offers { padding: 26px 0 40px; }
.home--compact .offers .secHead { margin-bottom: 16px; }
.home--compact .offers .secTitle { font-size: clamp(1.4rem, 2vw, 1.9rem); }
.home--compact .offers .eyebrow { display: none; }

/* Show the offers straight away rather than waiting for the scroll reveal */
.home--compact .offers [data-reveal] { opacity: 1; transform: none; transition: none; }

.home--compact .offerCard {
	flex-direction: column;
	align-items: stretch;
	aspect-ratio: auto;
	background: var(--forest-800);
}
.home--compact .offerCard::after { display: none; }
.home--compact .offerCard__badge { display: none; }

.home--compact .offerCard img {
	position: relative;
	inset: auto;
	z-index: 0;
	flex: none;
	width: 100%;
	height: auto;
	aspect-ratio: 1.66;
	object-position: 50% 75%;
}

/* Label and title on the left, arrow on the right */

.home--compact .offerCard__body {
	position: relative;
	z-index: 1;
	flex: 1 0 auto;
	display: grid;
	grid-template-columns: 1fr auto;
	align-content: center;
	align-items: center;
	column-gap: 16px;
	padding: 15px 26px 16px;
	background: var(--forest-800);
}

.home--compact .offerCard__label {
	grid-column: 1;
	margin-bottom: 6px;
	font-size: 11px;
	letter-spacing: .16em;
	color: #ffb26b;
}

/* Always two lines tall so the three boxes line up */
.home--compact .offerCard__title {
	grid-column: 1;
	min-height: 2.24em;
	font-size: clamp(1.05rem, 1.3vw, 1.25rem);
	line-height: 1.12;
}

.home--compact .offerCard__cta {
	grid-column: 2;
	grid-row: 1 / span 2;
	margin: 0;
	gap: 0;
	font-size: 0;
}
.home--compact .offerCard__cta .circleArrow {
	width: 42px; height: 42px;
	background: var(--cta);
	border-color: var(--cta);
	color: #fff;
	box-shadow: 0 8px 18px -8px rgba(239, 106, 12, .9);
}
.home--compact .offerCard:hover .circleArrow { background: var(--cta-hover); border-color: var(--cta-hover); }

@media (max-width: 760px) {
	.home--compact .hero__inner { min-height: 0; padding-top: calc(var(--announce-h) + 88px); }
	.home--compact .hero__title { font-size: clamp(2.6rem, 12vw, 3.4rem); }
	.home--compact .offers { padding-top: 20px; }
	.home--compact .offerCard { flex-basis: 72%; }
	.home--compact .offerCard__body { flex: none; padding: 16px 18px; }
}