/**
 * Homepage-specific sections.
 */

/* ======================= HERO ======================= */
.aap-hero {
	position: relative;
	min-height: 100svh;
	display: flex;
	align-items: flex-end;
	color: var(--color-white);
	background: var(--color-forest-dark);
	overflow: hidden;
}
.aap-hero-media { position: absolute; inset: 0; z-index: 0; }
.aap-hero-media img, .aap-hero-media video {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
	animation: aap-hero-zoom 18s var(--ease-out) forwards;
}
@keyframes aap-hero-zoom { from { transform: scale(1.08); } to { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .aap-hero-media img, .aap-hero-media video { animation: none; } }
.aap-hero-scrim {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(14,38,31,0.55) 0%, rgba(14,38,31,0.25) 38%, rgba(14,38,31,0.86) 100%);
}
.aap-hero-content {
	position: relative; z-index: 1;
	width: 100%;
	padding-block: calc(var(--space-24) + var(--space-10)) var(--space-16);
}
.aap-hero-eyebrow { color: var(--color-turquoise-light); }
.aap-hero-title {
	font-size: var(--text-5xl);
	color: var(--color-white);
	max-width: 16ch;
}
.aap-hero-subtitle {
	margin-top: var(--space-5);
	max-width: 52ch;
	font-size: var(--text-md);
	color: var(--color-text-on-dark-soft);
}
.aap-hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-8); }
.aap-hero-scroll-cue {
	position: absolute; bottom: var(--space-6); left: 50%; transform: translateX(-50%);
	z-index: 1;
	display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
	color: var(--color-text-on-dark-soft);
	font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-wider);
}
.aap-hero-scroll-cue svg { animation: aap-bob 2s ease-in-out infinite; }
@keyframes aap-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .aap-hero-scroll-cue svg { animation: none; } }

/* ======================= INTRO (split editorial) ======================= */
.aap-intro-media { position: relative; }
.aap-intro-media-frame { border-radius: var(--radius-md); overflow: hidden; aspect-ratio: 4/5; }
.aap-intro-media-frame img { width: 100%; height: 100%; object-fit: cover; }
.aap-intro-media-accent {
	/* .aap-intro-media has no overflow:hidden of its own (that's on
	 * .aap-intro-media-frame around the image only), so this badge can
	 * bleed past the image's corner without getting clipped by it. */
	position: absolute; bottom: calc(-1 * var(--space-6)); right: calc(-1 * var(--space-6));
	background: var(--color-turquoise);
	color: var(--color-white);
	padding: var(--space-6);
	border-radius: var(--radius-md);
	max-width: 260px;
	display: none;
}
@media (min-width: 640px) { .aap-intro-media-accent { display: block; } }
.aap-intro-media-accent .num { font-family: var(--font-display); font-size: var(--text-2xl); display: block; line-height: 1; }
.aap-intro-media-accent .label { display: block; margin-top: var(--space-2); font-size: var(--text-xs); line-height: 1.5; text-transform: uppercase; letter-spacing: var(--tracking-wide); }
.aap-intro-body h2 { margin-bottom: var(--space-5); }
.aap-intro-body .aap-prose { margin-bottom: var(--space-8); }

/* ======================= ACTIVITIES (section wrapper) ======================= */
.aap-activities-grid { }
.aap-activities-grid--home .aap-activity-card-media { aspect-ratio: 4 / 3; }

/* ======================= DESTINATION ======================= */
.aap-destination-feature {
	position: relative;
	border-radius: var(--radius-md);
	overflow: hidden;
	min-height: 440px;
	display: flex;
	align-items: flex-end;
	color: var(--color-white);
}
.aap-destination-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.aap-destination-feature-scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(14,38,31,0.82) 0%, rgba(14,38,31,0.05) 60%); }
.aap-destination-feature-body { position: relative; z-index: 1; padding: var(--space-8); max-width: 36rem; }
.aap-destination-feature-body h3 { color: var(--color-white); font-size: var(--text-2xl); }
.aap-destination-feature-body p { color: var(--color-text-on-dark-soft); margin-top: var(--space-3); }

.aap-destination-list { display: grid; gap: var(--space-5); margin-top: var(--space-5); }
@media (min-width: 760px) { .aap-destination-list { grid-template-columns: repeat(2, 1fr); } }
.aap-destination-chip {
	display: flex; gap: var(--space-4);
	padding: var(--space-5);
	background: var(--color-surface);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
}
.aap-destination-chip img, .aap-destination-chip-placeholder { width: 84px; height: 84px; object-fit: cover; border-radius: var(--radius-sm); flex-shrink: 0; }
.aap-destination-chip-placeholder { display: block; background: var(--color-forest-tint); }
.aap-destination-chip { transition: box-shadow var(--transition-base), transform var(--transition-base); }
.aap-destination-chip:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.aap-destination-chip h3, .aap-destination-chip h4 { font-size: var(--text-base); color: var(--color-forest); }
.aap-destination-chip p { font-size: var(--text-sm); color: var(--color-text-soft); margin-top: 4px; }

/* Homepage destination cards: full-bleed top image, three-up grid. */
.aap-destination-list--home { grid-template-columns: 1fr; }
@media (min-width: 640px) { .aap-destination-list--home { grid-template-columns: repeat(3, 1fr); } }
.aap-destination-chip--home { flex-direction: column; padding: 0; overflow: hidden; }
.aap-destination-chip--home img,
.aap-destination-chip--home .aap-destination-chip-placeholder {
	width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 0; flex-shrink: 0;
}
.aap-destination-chip--home > div { padding: var(--space-5); }

/* ======================= WHY CHOOSE ======================= */
.aap-why-grid { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 640px) { .aap-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .aap-why-grid { grid-template-columns: repeat(3, 1fr); } }
.aap-why-item { padding: var(--space-6); border-radius: var(--radius-md); background: var(--color-forest-light); color: var(--color-text-on-dark); }
.aap-why-icon {
	width: 52px; height: 52px; display: flex; align-items: center; justify-content: center;
	background: rgba(248,247,242,0.12); border-radius: 50%;
	color: var(--color-turquoise-light);
	margin-bottom: var(--space-5);
}
.aap-why-item h3 { color: var(--color-white); font-size: var(--text-lg); }
.aap-why-item p { color: var(--color-text-on-dark-soft); font-size: var(--text-sm); margin-top: var(--space-2); }

/* ======================= FEATURED EXPERIENCES ======================= */
.aap-featured-grid { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 760px) { .aap-featured-grid { grid-template-columns: repeat(2, 1fr); } }
.aap-featured-grid > a:first-child { }
@media (min-width: 1024px) {
	.aap-featured-grid { grid-template-columns: repeat(3, 1fr); }
	.aap-featured-grid > a:first-child { grid-column: span 2; grid-row: span 2; }
	.aap-featured-grid > a:first-child .aap-featured-card { aspect-ratio: 1/1; height: 100%; }
}

/* ======================= SIGNATURE EXPERIENCES (editorial index list) ======================= */
.aap-signature-list { display: flex; flex-direction: column; counter-reset: aap-signature; }
.aap-signature-row {
	display: flex;
	align-items: center;
	gap: var(--space-6);
	padding: var(--space-6) 0;
	border-top: 1px solid var(--color-line);
	counter-increment: aap-signature;
}
.aap-signature-list .aap-signature-row:last-child { border-bottom: 1px solid var(--color-line); }
.aap-signature-index {
	flex: 0 0 auto;
	font-family: var(--font-display);
	font-size: var(--text-xl);
	color: var(--color-turquoise);
	line-height: 1;
}
.aap-signature-index::before { content: "0" counter(aap-signature); }
.aap-signature-media {
	flex: 0 0 auto;
	display: block;
	width: 128px; height: 128px;
	border-radius: var(--radius-md);
	overflow: hidden;
}
.aap-signature-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--transition-slow); }
.aap-signature-row:hover .aap-signature-media img { transform: scale(1.08); }
.aap-signature-body { flex: 1 1 auto; min-width: 0; }
.aap-signature-body h3 { font-family: var(--font-display); font-size: var(--text-lg); color: var(--color-forest); }
.aap-signature-body p { font-size: var(--text-sm); color: var(--color-text-soft); margin-top: var(--space-2); max-width: 46ch; }
.aap-signature-cta {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; gap: var(--space-2);
	font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-wide);
	color: var(--color-forest);
	white-space: nowrap;
}
.aap-signature-cta svg { transition: transform var(--transition-fast); }
.aap-signature-row:hover .aap-signature-cta svg { transform: translateX(4px); }
@media (max-width: 759px) {
	.aap-signature-row { flex-wrap: wrap; gap: var(--space-4); padding: var(--space-5) 0; }
	.aap-signature-index { display: none; }
	.aap-signature-media { width: 92px; height: 92px; }
	.aap-signature-cta { flex-basis: 100%; margin-left: calc(92px + var(--space-4)); }
}

/* ======================= STATS STRIP ======================= */
.aap-stats { display: grid; gap: var(--space-6); grid-template-columns: repeat(2, 1fr); text-align: center; }
@media (min-width: 760px) { .aap-stats { grid-template-columns: repeat(4, 1fr); } }
.aap-stat-num { font-family: var(--font-display); font-size: var(--text-3xl); color: var(--color-forest); }
.aap-stat-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--color-text-soft); margin-top: var(--space-2); }

/* ======================= GALLERY TEASER (compact, homepage only) ======================= */
.aap-gallery-grid--compact { grid-template-columns: repeat(3, 1fr); gap: var(--space-2); }
@media (min-width: 640px) { .aap-gallery-grid--compact { grid-template-columns: repeat(5, 1fr); } }
@media (min-width: 1024px) { .aap-gallery-grid--compact { grid-template-columns: repeat(6, 1fr); } }