@media (max-width:1399px) {
	.treatment-bg {
		background: url(../img/treatment-bg.webp) no-repeat 50%;
	}

	.changes {
		height: 200px;
	}

	.heading {
		font-size: 3rem;
	}

}

@media (max-width:1199.98px) {
	p, .counter-label {
		font-size: 1.2rem;
	}

	.hero {
		min-height: 70vh;
	}

	.tagline h1 {
		font-size: 3rem;
	}

	.e-sub {
		font-size: 4rem;
	}

	.hero-overlay p {
		padding-top: 1rem;
		font-size: 1.5rem;
	}

	.hero-overlay img {
		/* width: 15%;
		translate: 2rem;
		padding: 0; */
	}

	.intro p span {
		font-size: 1.2rem;
	}

	.video-text {
		max-width: 60%;
	}

	.video-content {
		padding: 35px;
	}

	.heading {
		font-size: 2.8rem;
		line-height: 1;
	}

	.puzzle-box-text h2 img {
        left: auto;
        width: 60px;
        bottom: -35px;
        right: -30px;
        transform: rotate(28deg);
	}

	.puzzle-box-text p {
		padding-right: 0;
	}

	.child-img img.chat-icon {
		width: 70px;
	}

	.counter {
		font-size: 2.5rem;
	}

	.find-clinic {
		background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(../img/clinic-bg.webp) no-repeat center;
		padding: 6rem 3rem;
		min-height: auto;
	}

	.arrow-3 {
		width: 50px;
	}

	.text-overlay p, .text-overlay p.help, .text-overlay p.hope {
		font-size: 3.5rem;
	}

	.text-overlay p.struggle {
		left: -7rem;
	}

	.text-overlay p.strength {
		right: -7rem;
	}

	.text-overlay p.help {
		left: -2rem;
	}

	.text-overlay p.hope {
		right: -2rem;
	}

	.video-box {
		height: 350px;
	}

	.beat-sec {
		padding-top: 6rem;
		min-height: auto;
	}

	.locate-text p, .footer-locate a {
		font-size: 2rem;
	}

	.locate-text h3 {
		font-size: 4rem;
	}

	.footer-arrow svg {
		width: 110px;
		transform: rotate(30deg);
	}

	@keyframes slide2 {
		0% {
			transform: translate(0, 0);
		}

		50% {
			transform: translate(60px, -60px);
		}

		100% {
			transform: translate(0, 0);
		}

	}

	.puzzle-animation .symptoms-gif-group {
		display: block;
	}

	.button-text, .only-text, .svgs {
		display: none;
	}

	.puzzle-box-text h2 br {
		display: none;
	}

	.changes {
		height: 165px;
	}

	.changes img {
		width: 70px;
	}

	.blue-board {
		padding: 3rem 3rem 0 3rem;
	}

	.football-boy img {
		width: 365px;
	}

	.singing-lady img {
		width: 253px;
	}
	lottie-player{
        width: 210px;
        height: 60px;
	  }
	  .banner-heading div{
		left: -5px;
	  }
	  .awareness {
		width: 30%;
	}
}

@media (max-width:1024px) {
	.teens-sec {
		background-position: 35%;
		min-height: 50vh;
	}

	.card__side--back {
		padding: 20px;
		transform: rotate(0deg);
		position: static;
	}

	.card__side--back hr {
		margin-top: 0;
	}

	.cards-mobile {
		display: flex;
	}

	.cards-desktop {
		display: none;
	}

}

@media (max-width:991.9px) {
	.hero {
		min-height: 80vh;
	}

	.symptoms-bg {
		background-position: 60% 30%;
	}

	.symptoms-overlay img {
		width: 60px;
		right: 32%;
	}

	.heading {
		font-size: 2.2rem;
	}

	.find-clinic p {
		font-size: 2rem;
	}

	.puzzle-animation {
		padding-top: 0rem;
		padding-bottom: 0rem;
	}

	.card__side i {
		top: 12%;
		line-height: 0.1;
	}

	.childhood-sec {
		background-position: 55%;
		padding: 3rem 1rem;
	}

	.list-view ul li {
		gap: 15px;
		font-size: 1.2rem;
		line-height: 1.2;
	}

	.teens-sec {
		background-position: 32%;
		min-height: 50vh;
	}

	.treatment-bg {
		background: url(../img/treatment-bg.webp) no-repeat 55%;
	}

	.changes {
		height: 215px;
	}

	.changes img {
		width: 90px;
	}

	.treatment-main-sec .col {
		margin-bottom: 30px;
	}

	.singing-lady img {
		width: 203px;
		translate: 0px 100px;
	}

	.treatment-btm-sec {
		min-height: 65vh;
	}

	.football-boy img {
		width: 345px;
		translate: -9em -3rem;
	}

	.blue-board {
		padding: 3rem 5rem 0 5rem;
	}

	.yellow-arrow, .blue-arrow {
		display: none !important;
	}

	.navbar {
		background: transparent !important;
		transition: 0.3s ease;
		border-radius: 0px !important;
		position: fixed;
		width: 100%;
	}

	/* Add solid background after scroll (we'll toggle this with JS) */
	.navbar.scrolled {
		top: 0;
		transition: 0.3s ease;
		background: #fff !important;
		box-shadow: 0 0 10px #00000047;
	}

	.navbar-nav {
		gap: 5px;
		padding: 15px;
		background: #fff;
	}

}

/* Medium devices (tablets, ≥768px) */
@media (max-width:768.9px) {
	.hero {
		min-height: 75vh;
	}

	.video-text {
		max-width: 60%;
	}

	.arrow-3 {
		top: 2rem;
	}

	.find-clinic p {
		font-size: 2rem;
	}

	.locate-text h3 {
		font-size: 3rem;
	}

	@keyframes slide2 {
		0% {
			transform: translate(0, 0);
		}

		50% {
			transform: translate(30px, -30px);
		}

		100% {
			transform: translate(0, 0);
		}

	}

	footer ul li {
		padding-right: 10px;
	}

	footer ul li a, .terms a {
		font-size: 16px;
	}

	.tagline h1 {
		font-size: 2.3rem;
		margin-bottom: 2rem;
	}

	.e-sub {
		font-size: 3.5rem;
	}

	.hero-overlay p {
		font-size: 1.2rem;
	}

	.teens-sec {
		background-position: 34%;
	}

	.blue-arrow {
		left: -8rem;
		width: 30%;
	}

	.of-adhd {
		translate: 30px;
	}

	.loud {
		translate: 5rem 0.2rem;
	}

	.symptoms-overlay img {
		left: 38%;
	}
	lottie-player{
        width: 169px;
        height: 49px;
	  }
}

@media (max-width:767px) {
	.overlay-gradient {
		background: linear-gradient(to right, rgba(0, 0, 0, 0.5) 100%, rgba(0, 0, 0, 0) 80%);
	}

	.video-content {
		justify-content: center;
	}

	.video-text {
		display: none;
	}

	.video-text-mob {
		display: block;
	}

	p, .counter-label, .terms-sec p, .treatment-main-sec p {
		font-size: 1.1rem;
	}

	.beat-adhd-box {
		margin-top: 9rem;
	}

	.text-overlay p.struggle {
		left: 3rem;
		top: -3rem;
	}

	.text-overlay p.hope {
		right: 3rem;
		top: -3rem;
	}

	.text-overlay p.help {
		left: 3rem;
		bottom: -4rem;
	}

	.text-overlay p.strength {
		right: 3rem;
		bottom: -4rem;
	}

	.text-overlay p, .text-overlay p.help, .text-overlay p.hope {
		font-size: 3rem;
	}

	.arrow-3 {
		top: 5rem;
		left: 45%;
		width: 40px;
	}

	.bottom a.navbar-brand img {
		width: 40%;
		display: block;
		margin: 0 auto 2rem;
	}

	footer ul, .socials ul {
		text-align: center;
	}

	footer ul li {
		padding: 0 15px;
	}

	.puzzle-box-text {
		margin-top: 2rem;
	}

	.childhood-sec {
		background: url(../img/school-kids-mob-bg.webp) no-repeat 100%;
		background-size: cover;
		height: 1050px;
		align-items: start;
		justify-content: start;
		padding: 1.5em 1.5em 0;
	}

	.list-view ul li {
		gap: 20px;
		padding-bottom: 15px;
	}

	.list-view ul li img {
		width: 40px;
	}

	.teens-sec {
		background: url(../img/teens-mob-bg.webp) no-repeat top;
		background-size: cover;
		height: 1270px;
		align-items: start;
		justify-content: start;
	}

	.teens-sec .list-view {
		translate: 0 15rem;
	}

	.treatment-bg .tagline {
		translate: -25%;
	}

	.and {
		translate: 50px 30px;
		font-size: 39px;
	}

	/* .loud {
	translate: 5rem 1rem;
	} */
	.managing {
		translate: 50px 20px;
	}

	.treating {
		translate: 5rem 1.5rem;
	}

	.changes {
		height: 165px;
	}

	.treatment-btm-sec {
		min-height: 70vh;
	}

	.singing-lady img {
		width: 190px;
		translate: -4rem 8rem;
	}

	.blue-board {
		padding: 1rem 3rem 0 2rem;
	}

	.football-boy img {
		width: 300px;
		translate: -7rem -3rem;
	}

}

@media (max-width:660px) {
	.singing-lady, .football-boy {
		display: none;
	}

	.treatment-btm-sec .col-8 {
		width: 100%;
	}

	.blue-board {
		padding: 1rem 2rem 0 2rem;
	}

	.treatment-btm-sec {
		padding-bottom: 2rem;
	}

	.treating {
		translate: 6rem 1.4rem;
	}

	.managing {
		translate: 45% 42%;
	}

	.and {
		translate: 90px 30px;
		font-size: 39px;
	}

	.legends-heading p span {
		font-size: 1.3rem;
	}

}

/* Extra small devices (portrait phones, <576px) */
@media (max-width:575.98px) {
	.navbar {
		top: 0;
	}

	.logo {
		width: 80px;
	}

	.e-sub {
		font-size: 2.5rem;
		padding-right: 5px;
	}
	/* .hero::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.4); 
		z-index: 1; 
	}
	.hero > * {
		position: relative;
		z-index: 2; 
	} */
	.hero {
		min-height: 50vh;
        background-position: 55% 60px;
	}
	.banner-heading {
		/* color: #fff; */
	}
	.tagline h1 {
		font-size: 1.4rem;
		margin-top: 10rem;
	}

	.hero-overlay p {
		font-size: 1.2rem;
		width: 55%;
	}

	.play-btn {
		width: 70px;
		height: 70px;
	}

	.d-none-mob {
		display: none;
	}

	.navbar-nav {
		gap: 5px;
	}

	.puzzle-box-text h2 img {
		right: 0;
		width: 50px;
		left: auto;
		transform: rotate(44deg);
	}

	.counter-box {
		margin-bottom: 30px;
	}

	.counter-label {
		padding-top: 5px;
	}

	.teens-sec .list-view {
		translate: 0 13rem;
	}

	.teens-sec {
		height: 1190px;
	}

	.symptoms-bg {
		background: linear-gradient(rgb(0 0 0 / 30%), rgb(0 0 0 / 30%)), url(../img/symptoms-bg.webp) no-repeat 70% 10%;
		min-height: 80vh;
	}

	.too-active, .loud {
		box-shadow: 3px 15px 15px #00000061;
	}

	.of-adhd {
		translate: 10px;
	}

	.loud {
		translate: 2rem 0.2rem;
	}

	.treatment-bg .tagline {
		translate: 0% -11rem;
	}

	.treatment-bg {
		background: linear-gradient(rgb(0 0 0 / 30%), rgb(0 0 0 / 30%)), url(../img/treatment-bg.webp) no-repeat 68%;
		min-height: 80vh;
	}

	.and {
		translate: 10% 62%;
		font-size: 30px;
	}

	.correct {
		translate: 5px 5px;
	}

	.managing {
		translate: 0 50%;
	}

	.treating {
		translate: 2rem 1.2rem;
	}

	.changes {
		height: 160px;
		width: 160px;
		margin: auto;
	}

	.cmfi {
		width: 80%;
		margin: auto;
		display: block;
	}

	.blue-bird-icon {
		left: 8%;
	}

	.treatment-main-sec p {

		/* width: 85%; */
		display: block;
		margin: auto;
	}

	.treatment-main-sec .col {
		margin-bottom: 50px;
	}

	.blue-board p {
		font-size: 1.2rem;
	}

	.red-bird-icon {
		width: 35px;
	}

	.boat-icon {
		width: 60px;
	}

	.blue-bird-icon {
		width: 45px;
	}

	.changes img {
		width: 60px;
	}

	.arrow-3 {
		top: 4.2rem;
	}

	.navbar .container {
		padding: 0;
	}

	.heading {
		font-size: 2rem;
	}
	lottie-player {
		width: 104px;
        height: 28px;
    }
	.awareness {
		margin-top: 5%;
	}

}