.hero_header{
	display: block;
	position: relative;
	height: auto;
	max-width: unset;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	
	.hero-mobile-image{
		display: none;
		position: relative;
		width: 100%;
		height: auto;
	}
	
	.home-hero-spacer{
		max-height: 120px;
		min-height: 60px;
		height: 10vw !important;
	}
	
	
	@media (max-width: 780px) {
		
		.home-hero-spacer{
			display: none;
		}
	
		& .wp-block-cover__image-background{
			background-image: none !important;
			background-color: #000 !important;
		}
		
		& .wp-block-cover__gradient-background{
			display: none !important;
		}
		
		.gradient-overlay{
			display: block;
			position: absolute;
			top:0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		
		.hero-mobile-image{
			display: block;
			& img{
				width: 100%;
				height: auto;
			}
			.gradient-overlay{
				display: block;
				position: absolute;
				top:0;
				left: 0;
				background: linear-gradient(to bottom, 
					rgba(0, 0, 0, 0),  /* Transparent black at top (70% opacity) */
					rgba(0, 0, 0, 1)     /* Fully transparent at bottom */
				  );
			}
		}
	}
	
	
	& .bottom-curve{
		display: block;
		position: absolute;
		bottom: 0;
		width: 100vw;
		z-index: 1;
	}
	& .truck-circles{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: auto;
	}
	& .left-info{
		justify-self: flex-start;
		align-items: flex-start;
		position: relative;
		width: 100%;
		max-width: 480px;
		padding: 20px;
		background-color: rgba(0, 0, 0, 0.668);
		gap: 24px;
		color:#fff;
		
		@media (max-width: 780px) {
			max-width: 360px;
		}
		
		& h1{
			font-size: calc(26px + (39 - 26) * ((100vw - 300px) / (1600 - 300))) !important;
			font-weight: 700;
		}
		
		p{
			font-size: calc(16px + (28 - 16) * ((100vw - 300px) / (1600 - 300))) !important;
		}
		
		& .hero-accent{
			max-width: 60px;
		}
		
		& .hero-inner-blocks{
			justify-self: flex-start;
			align-items: flex-start;
			& p{
				margin:0;
				padding: 0;
			}
		}
	}
	
	& .blue-hero-info{
		font-size: calc(16px + (25 - 16) * ((100vw - 300px) / (1600 - 300))) !important;
	}
}

