/* Hero principal de la Home y heroes de fichas individuales. */
.hero {
	position: relative;
	min-height: 88vh;
	display: flex;
	align-items: flex-end;
	color: var(--color-on-primary);
	overflow: hidden;
}

.hero__media {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.hero__image,
.hero__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(32, 37, 34, 0.15) 0%, rgba(32, 37, 34, 0.75) 100%);
}

.hero__content {
	padding-block: var(--space-16) var(--space-12);
	max-width: 900px;
}

.hero__title {
	color: var(--color-on-primary);
	margin-bottom: var(--space-4);
}

.hero__subtitle {
	font-size: var(--fs-md);
	max-width: 55ch;
	opacity: 0.92;
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4);
	margin-top: var(--space-6);
}

.hero__search {
	margin-top: var(--space-8);
	max-width: 560px;
}

/* Hero de fichas individuales (destino/tour/blog): más bajo que el de home. */
.single-hero {
	position: relative;
	color: var(--color-on-primary);
	display: flex;
	align-items: flex-end;
	min-height: 55vh;
}

.single-hero--narrow {
	min-height: 46vh;
}

.single-hero__media {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.single-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.single-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(32, 37, 34, 0.1) 40%, rgba(32, 37, 34, 0.78) 100%);
}

.single-hero__content {
	padding-block: var(--space-10) var(--space-8);
}

.single-hero .breadcrumbs a,
.single-hero .breadcrumbs li {
	color: var(--color-on-primary);
	opacity: 0.85;
}

.single-hero__eyebrow {
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: var(--fs-sm);
	opacity: 0.85;
	margin-bottom: var(--space-2);
}

.single-hero__title {
	color: var(--color-on-primary);
}

.single-hero__meta {
	display: flex;
	gap: var(--space-4);
	margin-top: var(--space-3);
	font-weight: 600;
}

@media (max-width: 600px) {
	.hero {
		min-height: 70vh;
		align-items: center;
	}
}