:root {
	--line-align-mobile:left;
	--line-align-desktop:center;
	--line-margin-mobile: 0;
	--line-margin-desktop:0;

}
.hero-block {
	display:flex;
	position:relative;
	padding: 16px 0;
}

.purple {
	color:var(--header-auth-button-bg);
}

.hero-block__content {
	position: relative;
	z-index:1;
}

.hero-block__heading {
	font-family: "Sansita One";
	font-style: normal;
	font-weight: 400;
	line-height: .8em; 
	letter-spacing: -1.08px;
}

.hero-block__line {
	width:60%;
	color: #221A5B;
	font-family: Poppins;
	font-style: normal;
	font-weight: 400;
	line-height: normal;	
	text-align: var(--line-align-mobile);
	margin: var(--line-margin-mobile);
}

.hero-block__media {
	position:absolute;
	bottom:0;
	right:0;
	width:50%;
	z-index:0;
}

.hero-block__promo {
	border-radius: 100px;
	border: 2px dashed var(--brand-navy-button);
	background: #F6F6FF;
	display:flex;
	align-items: center;

	display: flex;
	padding: 5px 5px 5px 15px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	width:fit-content;
	font-size: clamp(18px, calc(4.74px + 3.536vw), 50px);
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

.hero-block__promo-copy {
	border:0;
	background-color:var(--brand-color-periwinkle);
	display: flex;
	padding: 6px 15px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	border-radius: 100px;
}

.hero-block__promo-copy:before {
	display:table;
	content: "";
	background-image: url(../hero/assets/icon-copy.svg);
	width:24px;
	height:24px;
	background-position: center;
	background-repeat: no-repeat;
}

.hero-block__promo-copy.is-copied:before {
	background-image: url(../hero/assets/icon-copied.svg);
}

a.hero-block__cta {
	display: flex;
	width: 177px;
	padding: 7.5px 0px;
	justify-content: center;
	align-items: center;
	gap: 7.5px;	
	border-radius: 75px;
	background: linear-gradient(180deg, var(--home-accent-start) 0%, var(--home-accent-end) 100%);
	color: #FFF;
	text-align: center;
	font-family: Poppins;
	font-size: 15px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	text-transform: uppercase;		
	text-decoration: none;
	width:160px;
}

@media (min-width:768px) {
	a.hero-block__cta {
		width:330px;
	}

	.hero-block__promo-copy:before {
		display:table;
		content: "COPY";
		color:white;
		background-image: none;
		width:fit-content;

		color: #FFF;
		text-align: center;
		font-size: 24px;
		font-style: normal;
		font-weight: 800;
		line-height: normal;
	}	

	.hero-block__promo-copy.is-copied:before {
		content: "COPIED";
		background-image:none;
	}

	.hero-block__line {
		text-align: var(--line-align-desktop);
		margin: var(--line-margin-desktop);
		width:100%;
	}

	.hero-block__media {
		width:48%;
	}

	.hero-block {
		display:flex;
		position:relative;
		padding-top: 73px;
		padding-bottom:0;
	}	

	a.hero-block__cta {
		width:100%;
	}

	.hero-block__promo {
		margin-left:auto;
		margin-right:auto;
		padding-left:40px;
		padding-right:20px;
	}

	.hero-block__line[data-align-desktop="center"] {
		margin-left: auto;
		margin-right: auto;
	}

	.hero-block__content {
		scale: .75;
		transform-origin: left;
	}

	.hero-block {
		padding-left: 2.5rem;
		padding-right: 2.5rem;
		
    	margin-right: calc(-1 * var(--home-content-padding-x));	
		align-items: center;	
	}	

}

@media (min-width:1024px) {
	.hero-block {
		justify-items: flex-end;
		flex-direction: row;
		justify-content: end;
		padding-top:0;
		margin-top:-20px;
	}
	.hero-block__media {
		position:relative;
		width:50%;
	}
	.hero-block__content {
		position:absolute;
		scale: .8;
		left: var(--home-content-padding-x);
	}
}

@media (min-width:1200px) {
	.hero-block__content {
		scale: .9;
	}

}