.hp-fscreen:first-child{
	padding-top: var(--cnt-vertical-padding);
}
.hp-fscreen{
	position: relative;
	z-index: 1;
}
.hp-fscreen .dscr{
	display: flex;
	flex-wrap: wrap; 
}
.hp-fscreen .dscr .icons{
	order: -1;
	margin-bottom: 33px;
	width: 100%;
}
.hp-fscreen .dscr .icons .item{
	width: 48px;
	height: 48px;
	position: relative;
	line-height: 48px;
	text-align: center;
	border-radius: 50%;
	
	font-size: 12px;
	font-family: var(--font-headings);
	font-weight: 700;
	color: var(--white);
}
.hp-fscreen .dscr .icons .item + .item{
	margin-left: -12px;
}
.hp-fscreen .dscr .icons .item img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.hp-fscreen .dscr .icons .item.txt{
	background: var(--blue);
}

.hp-fscreen .dscr h1{
	margin-bottom: 16px;
	width: 100%;
}
.hp-fscreen .dscr .subheading{
	margin-bottom: 32px;
	width: 100%;
	font-size: 18px;
	font-weight: 500;
}
.hp-fscreen .dscr .btn-wrap{
	margin-top: -8px;
}

.hp-fscreen .illustration{
	position: relative;
	margin-top: 33px;
}
.hp-fscreen .illustration .graph{
	width: calc(100% - 68px);
	margin-left: auto;
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.50);
	box-shadow: -1.662px 1.662px 24.935px 3.325px rgba(0, 0, 0, 0.05);
	backdrop-filter: blur(6px);
	overflow: hidden;
	padding: 18px;
	position: relative;
	z-index: 1;
	
	display: flex;
}
.hp-fscreen .illustration .graph > .responsive-img{
	border-radius: 28px;
	width: 71%;
	margin-left: auto;
}
.hp-fscreen .illustration .graph > .responsive-img::after{
	padding: 39.7%;
}

/* icons */
.hp-fscreen .illustration .graph .items{
	order: -1;
	width: 32px;
	flex-shrink: 0;
}
.hp-fscreen .illustration .graph .item{
	color: var(--white);
	position: absolute;
	border-radius: 44px;
	font-size: 10px;
	line-height: normal;
	padding: 5px 7px 5px 5px;
	
	display: flex;
	align-items: center;
	
	top: 50%;
	transform: translatey(-50%);
	transition: none;
	z-index: 2;
	left: 7%;
}
.hp-fscreen .illustration .graph .item .responsive-img{
	width: 14px;
	height: 14px;
	margin-right: 6px;
}

.hp-fscreen .illustration .graph .item:nth-child(1){
	top: 28%;
	left: 12%;
}
.hp-fscreen .illustration .graph .item:last-child{
	top: 73%;
	left: 12%;
}

/* second illustration */
.hp-fscreen .illustration > .responsive-img{
	width: calc(100% - 59px);
	margin-top: -41%;
	border-radius: 28px;
	max-height: 340px;
}
.hp-fscreen .illustration > .responsive-img::after{
	padding-top: 84%;
}

@media (min-width: 390px){
	.hp-fscreen .illustration .graph .item{
		font-size: 10px;
		padding: 7px 9px 7px 8px;
	}
	.hp-fscreen .illustration .graph .item .responsive-img{
		width: 20px;
    	height: 20px;
		margin: -1px 5px -1px -1px;
	}
}
@media (min-width: 460px){
	.hp-fscreen .illustration .graph .item{
		font-size: 16px;
	}
}
@media (min-width: 560px){
	.hp-fscreen .dscr .icons .item{
		width: 34px;
    	height: 34px;
		line-height: 32px;
		font-size: 8px;
	}
	.hp-fscreen .dscr .icons .item + .item{
		margin-left: -14px;
	}
	.hp-fscreen .dscr .subheading{
		font-size: 18px;
	}
	
	.hp-fscreen .illustration .graph .item:nth-child(1){
		top: 23%;
	}
	.hp-fscreen .illustration .graph .item:last-child{
		top: 77%;
	}
	.hp-fscreen .illustration .graph > .responsive-img{
		width: 79%;
	}
}

@media (min-width: 620px){
	.hp-fscreen .illustration .graph{
		padding: 32px;
		border-radius: 64px;
	}
	.hp-fscreen .illustration .graph .item{
		font-size: 18px;
		padding: 7px 9px 7px 9px;
		left: 10%;
	}
	.hp-fscreen .illustration .graph .item:nth-child(1){
		left: 15%;
	}
	.hp-fscreen .illustration .graph .item:last-child{
		left: 15%;
	}
	.hp-fscreen .illustration .graph .item .responsive-img{
		width: 24px;
        height: 24px;
	}
	.hp-fscreen .illustration .graph > .responsive-img{
		border-radius: 42px;
	}
	.hp-fscreen .illustration .graph,
	.hp-fscreen .illustration > .responsive-img{
		border-radius: 56px;
	}
}
@media (min-width: 768px){
	.hp-fscreen .dscr .icons{
		margin-bottom: 24px;
		margin-top: 10px;
	}
	.hp-fscreen .dscr h1{
		margin-bottom: 20px;
	}
	.hp-fscreen .dscr .subheading{
		margin-bottom: 28px;
	}
	.hp-fscreen .illustration{
		margin-top: 36px;
	}
    .hp-fscreen .illustration > .responsive-img{
        max-height: 390px;
    }
	.hp-fscreen .illustration .graph > .responsive-img{
		border-radius: 44px;
	}
	
	.hp-fscreen .illustration .graph .item{
		font-size: 24px;
		padding: 13px 17px 13px 10px;
		left: 6%;
	}
	.hp-fscreen .illustration .graph .item .responsive-img{
		width: 34px;
		height: 34px;
		margin: 0px 13px 0px 0px;
	}
}

@media (max-width: 967px){
	.hp-fscreen .illustration{
		margin-left: auto;
		margin-right: auto;
		padding-top: 119px;
	}
	.hp-fscreen .illustration .graph{
		max-width: 470px;
		position: absolute;
		right: 0;
		top: 0;
	}
	.hp-fscreen .illustration > .responsive-img{
		margin-top: 0;
		max-height: 310px;
	}
}
@media (min-width: 410px) and (max-width: 967px){
	.hp-fscreen .illustration{
		padding-top: 60px;
	}
}
@media (min-width: 580px) and (max-width: 967px){
	.hp-fscreen .illustration > .responsive-img{
		width: calc(100% - 60px);
	}
}

@media (min-width: 968px){
	.hp-fscreen > .cnt{
		display: flex;
	}
	.hp-fscreen .dscr{
		padding-right: 23px;
		height: 100%;
	}
	.hp-fscreen .dscr .icons{
		margin-top: 0;
	}
	.hp-fscreen .dscr .subheading{
		font-size: 16px;
	}
	
	/**/
	.hp-fscreen .illustration{
		flex-shrink: 0;
		width: 45%;
		max-width: 830px;
		margin-top: 0;
	}
	.hp-fscreen .illustration .graph > .responsive-img{
		border-radius: 30px;
		min-height: 250px;
	}
	.hp-fscreen .illustration .graph{
		padding: 20px;
		width: calc(100% - 50px);
	}
	
	.hp-fscreen .illustration .graph .item{
		font-size: 16px;
        padding: 7px 10px 7px 7px;
	}
	.hp-fscreen .illustration .graph .item .responsive-img{
		width: 24px;
		height: 24px;
		margin-right: 6px;
	}
	.hp-fscreen .illustration .graph .item:nth-child(1){
		top: 26.5%;
	}
	.hp-fscreen .illustration .graph .item:last-child{
		top: 72%;
	}
	
	/**/
	.hp-fscreen .illustration > .responsive-img{
		width: calc(100% - 50px);
		margin-top: -147px;
        height: 100%;
		position: absolute;
	}
}

@media (min-width: 1100px){
	.hp-fscreen .dscr,
	.hp-fscreen .illustration{
		margin-top: -20px;
	}
	.hp-fscreen .dscr .icons .item{
		width: 42px;
        height: 42px;
        line-height: 42px;
		font-size: 11px;
	}
	.hp-fscreen .dscr .icons .item + .item{
		margin-left: -17px;
	}
	
	.hp-fscreen .dscr .subheading{
		font-size: 18px;
	}

	.hp-fscreen .illustration .graph{
		padding: 24px;
	}
}

@media (min-width: 1170px){
    .hp-fscreen .illustration > .responsive-img{
        max-height: unset;
        height: 116%;
    }
}
@media (min-width: 1200px){
	.hp-fscreen .dscr,
	.hp-fscreen .illustration{
		margin-top: -36px;
	}
	.hp-fscreen .illustration .graph{
		width: calc(100% - 60px);
		padding: 25px;
	}
	.hp-fscreen .illustration > .responsive-img{
		width: calc(100% - 60px);
	}
}

@media (min-width: 1312px){
    .hp-fscreen .illustration{
        max-width: 492px;
    }
}
@media (min-width: 1360px){
	.hp-fscreen .illustration .graph{
		padding: 28px;
	}
    .hp-fscreen .illustration > .responsive-img{
        height: 122%;
    }
}
@media (min-width: 1440px){
	.hp-fscreen{
		padding-bottom: 88px;
	}
	.hp-fscreen > .cnt{
		margin-top: -8px;
	}
	.hp-fscreen .dscr,
	.hp-fscreen .illustration{
		margin-top: -32px;
	}
    .hp-fscreen .illustration{
        max-width: unset;
    }
	.hp-fscreen .illustration .graph{
		padding: 32px;
	}
    .hp-fscreen .illustration > .responsive-img{
        margin-top: -30%;
		height: auto;
		max-height: 523px;
    }
	
	.hp-fscreen .dscr .icons{
		margin-bottom: 58px;
	}
	.hp-fscreen .dscr .icons .item{
		width: 48px;
        height: 48px;
        line-height: 48px;
        font-size: 12px;
	}
	.hp-fscreen .dscr .icons .item + .item{
		margin-left: -12px;
	}
	
	.hp-fscreen .dscr h1{
		font-size: 46px;
		margin-bottom: 32px;
	}
	
	.hp-fscreen .dscr .subheading{
		font-size: 20px;
		margin-bottom: 21px;
	}
	
	.hp-fscreen .dscr .btn-wrap{
		margin-top: 2px;
	}
}

@media (min-width: 1580px){
	.hp-fscreen .dscr h1{
		font-size: 52px;
	}

	.hp-fscreen .illustration .graph{
		padding: 38px;
	}
}

@media (min-width: 1730px){
	.hp-fscreen .illustration{
		width: 54.5%;
		margin-right: -5.5%;
		left: -1.8%;
	}
	.hp-fscreen .illustration .graph{
		width: 82%;
		box-shadow: -4px 4px 60px 0px rgba(0, 0, 0, 0.05);
		backdrop-filter: blur(14px);
		padding: 44px;
	}
	.hp-fscreen .illustration .graph > .responsive-img{
		width: 71.5%;
		border-radius: 56px;
	}
	.hp-fscreen .illustration .graph > .responsive-img::after{
		padding: 39%;
	}
	.hp-fscreen .illustration .graph .item:nth-child(1),
	.hp-fscreen .illustration .graph .item:last-child{
		left: 13%;
	}
	
	.hp-fscreen .illustration .graph .item{
		font-size: 20px;
		padding: 12px 18px 12px 12px;
		left: 7%;
	}
	.hp-fscreen .illustration .graph .item .responsive-img{
		width: 28px;
        height: 28px;
        margin: 0px 13px 0px 0px;
	}
	
	.hp-fscreen .illustration > .responsive-img{
		width: 83%;
        margin-top: -18%;
		max-height: 565px;
	}
}