
/* components/_steps.css */



.c-steps {
	display: grid;
	gap: var(--space-20);
	grid-template-columns: repeat( auto-fit, minmax(min(50vw,580px), 1fr) );
}
	.c-steps__image {
		width: clamp( 300px, 80vw, 700px );
		margin-top: max( calc( -4vw + 20px), -40px );
		justify-self: end;	
		margin-right: max( -5vw, -40px );	
	}

	.c-steps__video {
		max-width: 100%;
		width: 100%;
		margin-top: 40px;
	}

	.c-steps__image {
		width: clamp( 300px, 80vw, 700px );
		margin-top: max( calc( -4vw + 20px), -40px );
		justify-self: end;	
		margin-right: max( -5vw, -40px );	
	}
	.c-steps__video {
		max-width: 100%;
		width: 100%;
		margin-top: 40px;
	}
	.c-steps__quickguide {
		text-align: center;
	}

	.plus_min{
		height: 10px;
		display: inline;
	}

	.rotate{
		transform: rotate(180deg);
	}

@media ( min-width: 1000px ) {
	.c-steps  { 
		grid-template-columns: minmax(40%, 1fr) fit-content(700px);
	}
	.c-steps__quickguide {
		text-align: center;
	  }
}
@media ( min-width: 1500px ) {
	.c-steps__video {
		margin-left: 40px;
	}
	.c-steps__quickguide {
		margin-top: -2.5em;
		text-align: right;
	  }
}