.viva-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: 82svh;
	display: grid;
	align-items: end;
	padding-block: calc(var(--viva-header-height-mobile) + 3rem) 3.5rem;
	background:
		linear-gradient(to top, rgb(7 10 8 / 0.94) 0%, rgb(7 10 8 / 0.42) 54%, rgb(7 10 8 / 0.30) 100%),
		var(--viva-color-charcoal);
}

.viva-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(circle at 12% 18%, rgb(212 175 55 / 0.09), transparent 26%),
		radial-gradient(circle at 88% 12%, rgb(48 80 80 / 0.20), transparent 32%);
}

.viva-hero__content {
	max-width: 760px;
}

.viva-hero__title {
	max-width: 12ch;
	margin-bottom: 1rem;
}

.viva-hero__tagline {
	color: var(--viva-color-vanilla);
	font-size: clamp(1.1rem, 4.5vw, 1.55rem);
	font-weight: 400;
}

.viva-hero__actions {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.75rem;
	margin-top: 1.75rem;
}

.viva-hero--arch-image img {
	border-radius: 180px 180px var(--viva-radius-lg) var(--viva-radius-lg);
}