/* Hero — full-bleed editorial portrait, dark gradient, max content width. */

.section--hero {
	position: relative;
	min-height: clamp(600px, 80vh, 880px);
	display: grid;
	align-items: center;
	overflow: hidden;
	padding-block: 0;
	color: var(--c-on-primary);
}

.hero__media { position: absolute; inset: 0; z-index: 0; }
.hero__image { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(27, 28, 26, 0.35), rgba(27, 28, 26, 0.65));
}

/* Empty state — soft warm gradient instead of blank gray */
.section--hero-empty .hero__media {
	background:
		radial-gradient(ellipse at 30% 30%, color-mix(in srgb, var(--c-primary) 25%, transparent), transparent 60%),
		linear-gradient(135deg, var(--c-on-surface), var(--c-inverse-surface));
}
.section--hero-empty .hero__overlay { background: linear-gradient(180deg, rgba(27, 28, 26, 0.5), rgba(27, 28, 26, 0.7)); }

.hero__inner { position: relative; z-index: 1; padding-block: var(--sp-lg); }
.hero__title {
	color: var(--c-on-primary);
	font-size: var(--fs-display-lg);
	max-width: 18ch;
	margin: 0 0 var(--sp-sm);
}
.hero__lead {
	font-size: var(--fs-body-lg);
	max-width: 44ch;
	color: color-mix(in srgb, var(--c-on-primary) 90%, transparent);
	margin: 0 0 var(--sp-md);
}
.hero__actions {
	display: flex;
	flex-direction: column;
	gap: var(--sp-xs);
}
@media (min-width: 640px) {
	.hero__actions { flex-direction: row; flex-wrap: wrap; gap: var(--sp-gutter); }
}