.section-bg {
	background-size: contain;
	background-position: right top;
	height: 400px; 
	position: relative;
	background-repeat: no-repeat;
	width: 100%;
}

.text-section {
	position: relative;
	margin-top: -200px; /* Adjust overlap */
	z-index: 2;
}
.position-bottom .text-section {
	margin-top: -300px;
}

.featured h1 {
	font-size: 70px;
	line-height: 110%;
    margin-bottom: 44px;
}

.featured h1 span {
	background: var(--Yellow);
	padding: 0px 20px 4px 20px;
	border-radius: 30px 0;
    margin-left: -15px;
    display: inline-block;
}

.featured h6 {
	font-size: 27px;
	line-height: 150%;
	color: rgba(28, 27, 23, 0.80);
	margin-bottom: 20px;
    text-transform: uppercase;
}

.featured h3 {
    max-width: 1015px;
    line-height: 150%;
}

.featured a.btn:not(header .btn) {
    margin-top: 40px;
}

.acfe-flexible-placeholder .position-bottom .text-section {
	margin-top: -200px;
}

.tangle {
	background-repeat: no-repeat;
	background-position: 95% 350px;
	background-size: 30%;
    position: absolute;
    height: 200vh;
    width: 100%;
    top: 0;
    z-index: -1;
}

@media (max-width: 1560px) {
    .section-bg {
        height: 320px;
    }
    .position-bottom .text-section {
        margin-top: -200px;
    }
}

@media (min-width: 991px) and (max-width: 1440px) {
    .featured h1 {
		font-size: 42px;
	}

	.featured h5 {
		font-size: 18px;
	}
}

@media (max-width: 1370px) {
	.section-bg {
		height: 340px;
	}
    .tangle {
        background-position: 95% 150px;
    }
}

@media (max-width: 1199px) {
	.section-bg {
		height: 300px;
	}
}

@media (min-width: 991px) and (max-width: 1199px) {
	.section-bg {
		height: 235px;
	}
    .position-bottom .text-section {
        margin-top: -180px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .featured h1 {
		font-size: 42px;
	}

	.featured h5 {
		font-size: 18px;
	}
}

@media (max-width: 991px) {
	.section-bg {
		height: 60vh;
	}
}

@media (max-width: 767px) {
	.section-bg {
		height: 21vh;
	}
	.text-section {
		margin-top: 0;
	}
    .position-bottom .text-section {
        margin-top: 0;
    }
    .featured h1 {
		font-size: 42px;
        margin-bottom: 20px;
	}

	.featured h5 {
		font-size: 18px;
	}

    .featured h1 span {
        border-radius: 20px 0;
        padding: 0px 10px 4px 15px;
	}

    .featured h6 {
        font-size: 20px;
    }

    .featured h1 br {
        display: none;
    }
    .featured h3 {
        font-size: 18px;
        line-height: 130%;
    }
    .featured a.btn:not(header .btn) {
        margin-top: 20px;
        width: 100%;
        text-align: center;
        padding: 12px 10px;
    }
    .tangle {
        background-position: 95% 150px;
    }
}
