section.page-hero-default {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	margin-block: 0;

	.hero-anim-enter {
		opacity: 0;
	}
	
	
	@media (width > 1024px) {
		/* min-height: 69rem; */
		/* min-height: clamp(45rem, 65vh, 69rem); */
		min-height: clamp(42rem, 58vh, 69rem);
	}
	min-height: clamp(22rem, 50vh, 48rem);
	
	display: grid;
	grid-template-areas: 'stack';
	
	.hero-background,
	.hero-foreground {
		grid-area: stack;
	}

	.hero-background:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: linear-gradient(to top, rgba(0, 0, 0, 1), transparent 100%);
		opacity: .8;
		z-index: 0;
	}

	&.no-overlay .hero-background:before {
		display: none;
	}

	.hero-foreground {
		display: grid;
		grid-template-rows: 1fr;
		gap: var(--spacing-500);
		padding-top: var(--spacing-800);
		padding-bottom: var(--spacing-500);
		
		&:has(.row-breadcrumb) {
			grid-template-rows: 1fr auto;
			padding-bottom: 0;
		}

		.row-breadcrumb {
			background: color-mix(in srgb, var(--color-brand-black), transparent 65%);
		}

		@media (width <= 1024px) {
			&:has(.row-breadcrumb) {
				grid-template-rows: 1fr;
				padding-block: var(--spacing-500);
				min-height: 24rem;
				.row-breadcrumb {
					display: none;
				}
			}
		}
	}
	
	.hero-image,
	.hero-video {
		width: 100%;
		height: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		object-fit: cover;
		object-position: center;
		z-index: -1;
		object-position: var(--bg-focus-desktop-x) var(--bg-focus-desktop-y);
		@media (width <= 940px) {
			object-position: var(--bg-focus-mobile-x) var(--bg-focus-mobile-y);
		}
	}


	&:has(.nammo-home-hero-logo-container) {
		background-color: #010306;
	}

	.nammo-home-hero-logo-container {
		display: grid;
		place-items: center;
		height: 100%;
		width: 100%;
	}
	.nammo-home-hero-logo {
		width: 30rem;
		max-width: 69vw;
		height: auto;
	}

	.page-title {
		margin: 0;

		&.medium-title {
			font-size: var(--font-size-650);
			max-width: 40ch;
			text-wrap: balance;
			@media (width < 768px) {
				font-size: var(--font-size-550);
			}
		}
		&.long-title {
			font-size: var(--font-size-600);
			max-width: 50ch;
			text-wrap: balance;
			@media (width < 768px) {
				font-size: var(--font-size-500);
			}
		}
	}

	.hero-description {
		margin: 0;
	}

	.image-credits {
		position: relative;
		z-index: 1;
		padding: .5em;
		text-align: right;
		align-self: end;
		justify-self: end;
		font-size: var(--font-size-200);
		background: #0004;
		color: white;
		width: fit-content;
		margin: 0 .5em;
	}
	
		
	
	.page-container {
		position: relative;
		z-index: 1;
		width: 100%;
		color: white;

		.hero-content {
			display: grid;
			align-content: end;
			justify-items: start;
			min-height: 100%;
			width: 100%;

			/* Vertical */
			&.align--v-top 		{ align-content: start; }
			&.align--v-middle 	{ align-content: center; }
			&.align--v-bottom 	{ align-content: end; }
	
			/* Horizontal */
			&.align--h-left {
				text-align: left;
				justify-items: start;
			}
			&.align--h-center {
				justify-items: center;
				text-align: center;
			}
			&.align--h-right {
				text-align: right;
				justify-items: end;
			}
		}

		p {
			max-width: 69ch;
		}
	}


	.hero-quicklinks {
		--accent-colour: white;

		width: 100%;
		height: auto;
		display: flex;
		justify-content: center;
		padding: 0.75rem 1rem;
		background: #0004;
		/* outline: 1px dashed #fff8; */
		@media (width > 940px) {
			position: absolute;
			bottom: 0;
			left: 0;
		}
	}
}