@font-face{
	font-family: Circular;
	src: url(/wp-content/themes/gridlove-child/assets/fonts/Circular-Regular.woff2) format("woff2");
	font-weight: 400;
	font-style:normal;
	font-display:swap;
}
@font-face{
	font-family: Circular;
	src: url(/wp-content/themes/gridlove-child/assets/fonts/Circular-Medium.woff2) format("woff2");
	font-weight: 450;
	font-style:normal;
	font-display:swap;
}
@font-face{
	font-family: Circular;
	src: url(/wp-content/themes/gridlove-child/assets/fonts/Circular-Bold.woff2) format("woff2");
	font-weight: 700;
	font-style:normal;
	font-display:swap;
}
:root{
	--font-family: Circular, Arial;

	--primary-color:#F1461C;
	--primary-color-hover:#FF5A31;
	--primary-color-active:#DE411A;
	--primary-color-disabled:#E8E8E8;
	--main-font-color:#222222;
	--sense-white:#FFFFFF;
	--light-grey:#B3B3B3;
	--mid-grey:#909090;
	--dark-grey:#5A5A5A;
	--darkest-grey:#323232;
	--hairlines:#DADADA;


	--container-width:max(85%, 1400px);
	--container-padding:40px;
}
body{
	max-width: unset !important;
	font-family: var(--font-family);
	font-weight: 400;
	color: var(--main-font-color);
	background:white;
	font-size: 21px;
	line-height: 29px;
}
h1, h2, h3, h4, h5, h6, 
.h1, .h2, .h3, .h4{
	font-family: var(--font-family);
	color: var(--main-font-color);
}
.h1{
	font-style: normal;
	font-weight: 500;
	font-size: 102px;
	line-height: 104px;
	letter-spacing: -3px;
}
.h2{
	font-style: normal;
	font-weight: 500;
	font-size: 80px;
	line-height: 93px;
	letter-spacing: -1.3px;
}
.h3{
	font-weight: 500;
	font-size: 55px;
	line-height: 60px;
	letter-spacing: -1.5px;
}
.h4{
	font-weight: 500;
	font-size: 42px;
	line-height: 60px;
}
.text1{
	font-weight: 400;
	font-size: 25px;
	line-height: 35px;
}
.button{
	background-color: var(--primary-color);
	font-weight:450;
	border-radius: 50px;
	font-size: 14px;
	line-height: 16px;
	padding:12px 39px;
	color:white;
	height: unset;
    text-transform: none;
    box-shadow: none;
    display: inline-block;
    transition:background-color 0.3s ease;
}
.button:hover{
	background-color:var(--primary-color-hover);
	color:white;
}
.button:active{
	background-color:var(--primary-color-active);
	color:white;
}
.button:disabled{
	background-color:var(--primary-color-disabled);
}
.btn-hero.button{
	font-size: 15px;
	padding:14px 45px;
}
.secondary-button{
	display: inline-block;
	font-weight: 450;
	font-size: 18px;
	line-height: 25px;
	color: var(--main-font-color);
	border-radius: 50px;
	height: unset;
    text-transform: none;
    box-shadow: none;
    border: 2px solid var(--main-font-color);
    padding:11px 26px;
}
.visually-hidden{
	position:absolute;
	opacity:0;
	width:0;
	height:0;
	overflow:hidden;
}
.centered{
	max-width:var(--container-width);
	padding:0 var(--container-padding);
	margin:0 auto;
}
.product__get-button {
    padding: 14px 26px;
    font-weight: 450;
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 17px;
}
.slide-up{
	transition:transform 0.4s ease-out;
	opacity:1;
	transform: translateY(5vh);
}
.slide-up.animate{
	opacity:1;
	transform: translateY(0);
}
.parallax-overlay{
	position:absolute;
	left:0;
	width:100vw;
	height:100vh;
	z-index:1;
}
.parallax-obj{
	width: inherit;
	height:inherit;
	border-radius: 0px 0px 40px 40px;
	background:white;
	//transition: transform 0.1s linear;
}
body.popup-opened{
	overflow: hidden;
}
body.popup-opened #popup-container{
	display:flex;
}
#popup-container{
	display:none;
	background:#5A5A5AB3;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height: 100%;
	z-index: 9999;
	justify-content: center;
	align-items: center;
	font-size: 21px;
	line-height: 29px;
}
.popup-content{
	position: relative;
	background:white;
	border-radius: 50px;
	padding: 128px 160px 114px 160px;
	width: 831px;
	max-width: 95%;
	min-height: 100px;
	max-height: 100vh;
	overflow: overlay;
}
.popup-close{
	border:0;
	position: absolute;
	top: 49px;
    left: 53px;
	width:50px;
	height:50px;
	background: url(/wp-content/themes/gridlove-child/assets/img/close-button.svg);
	background-size: contain;
	background-repeat: no-repeat;
}
.num-anim-wrap{
	overflow:hidden;
	display:inline-block;
	vertical-align:bottom;
}
.num-anim-wrap>span{
	display:inline-block;
}
.num-anim-col{
	position: relative;
}
.animate .num-anim-col{
	transition:top 3s cubic-bezier(0.06, 0.46, 0.07, 0.93);
}
.animate .num-anim-wrap:first-of-type .num-anim-col{
	transition:top 2s cubic-bezier(0.06, 0.46, 0.07, 0.93);
}
@media(min-width:1980px){
	:root{
		--container-width:max(85%, 2238px);
		--container-padding:164px;
	}
	.button{
		font-size: 18px;
		line-height: 25px;
		padding:12px 47px;
	}
	.btn-hero.button{
		font-size: 19px;
		line-height: 25px;
		padding:15px 50px;
	}
}
@media(min-width:1981px){
	
}
@media(max-width:1980px){
	:root{
		--container-width:max(85%, 990px);
	}
	.popup-content{
		width: 789px;
		padding: 118px 130px 96px 141px;
	}
	body .h1{
		font-size: 64px;
		line-height: 68px;
		letter-spacing: -1px;
	}
	body .h2{
		font-size: 44px;
		line-height: 46px;
		letter-spacing: -0.804571px;
	}
	body .h3{
		font-size: 20px;
		line-height: 24px;
		letter-spacing: unset;
	}
	body .h4{
		font-size: 18px;
		line-height: 22px;
		letter-spacing: unset;
	}
	
}
@media(min-width:980px){
	
	.tablet{
		display:none !important;
	}
}
@media(max-width:980px){

	body{
		font-size: 16px;
		line-height: 20px;
	}
	.tablet{
		display:block !important;
	}
	.no-tablet{
		display: none !important;
	}
	#popup-container{
		font-size: 16px;
    	line-height: 20px;
	}
	.popup-content {
	    width: 579px;
	    padding: 99px 109px 59px 94px;
	    border-radius: 40px;
	}
	.popup-close{
		top: 40px;
	    left: 40px;
	    width: 32px;
	    height: 32px;
	}
	body .h1{
		font-size: 42px;
		line-height: 48px;
		letter-spacing: -1px;
	}
	body .h2{
		font-size: 32px;
		line-height: 38px;
		letter-spacing: -0.804571px;
	}
	body .h3{
		font-size: 28px;
		line-height: 32px;
		letter-spacing: -0.6px;
	}
	body .h4{
		font-size: 22px;
		line-height: 24px;
		letter-spacing: -0.3px;
	}
	.button{
		font-size: 18px;
		line-height: 18px;
		padding:15px 45px;
	}
	.btn-hero.button{
		font-size: 19px;
		line-height: 19px;
		padding:17px 50px;
	}
}
@media(max-width:500px){
	:root{
		--container-padding:20px;
	}
	#popup-container{
		padding:0 var(--container-padding);
	}
	.popup-content {
	    padding: 99px 35px 89px 34px;
	    border-radius: 32px;
	    max-width: 100%;
	}
	.popup-close {
	    top: 23px;
	    left: 25px;
	}
}