html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: #f9ef69;
	scroll-behavior: smooth;

}


.desktop-4 {
	width: 100%;
	position: relative;
	height: 5910px;
	overflow: hidden;
	text-align: center;
	font-family: Domine;
	color: #28261b;
	font-size: 64px;
	scroll-margin-top: 80px;
}

.section-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	margin-bottom: 8px;
}


.heading {
	line-height: 38px;
	position: relative;
	z-index: 2;
}

.sub-heading {
	font-family: Inter;
	font-size: 20px;
	font-weight: 100;
	opacity: 0.8;
}

.brand {
	text-decoration: none;
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}


.brand-name {
	position: relative;
	letter-spacing: -0.04em;
	line-height: 100%;
	color: #00346b;
	/* font-family: 'Pacifico', cursive; */
}


/* LOGO */
.logo {
	height: 32px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 10px;
}


/* Navbar- Start */

.desktop-4-child {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
}

.nav-bar {
	position: fixed;
	top: 0;
	left: 0;
	backdrop-filter: blur(40px);
	background-color: rgba(248, 239, 190, 0.4);
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	padding: 20px 80px 20px;
	box-sizing: border-box;
	gap: 0px;
	text-align: left;
	font-size: 15px;
	font-family: Outfit;
	transition: top 0.3s ease-in-out;
	z-index: 1000;
}

.heading1 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	z-index: 0;
	font-size: 24px;
	font-family: Pacifico;
}

.button4 {
	width: 127px;
	border-radius: 10px;
	background-color: #235789;

	font-family: Outfit;
	color: #fefcf2;
	height: 40px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	box-sizing: border-box;
}

.button4:hover {
	transform: scale(1.1);
	background-color: #0056b3;
}

.nav-link {
	text-decoration: none;
	color: #281d1b;
	font-weight: 500;
	font-family: 'Poppins', sans-serif;
	padding: 8px 12px;
	transition: color 0.3s ease;
}

.nav-link.active,
.nav-link:hover {
	color: #693C41;
	font-weight: 700;
}

/* nav ul {
	list-style: none;
	display: flex;
	gap: 16px;
	padding: 0;
	margin: 0;

	flex-direction: row;
	align-items: center;
	justify-content: center;
	z-index: 1;
} */


nav ul {
	width: 560px;
	list-style: none;
	display: flex;
	padding: 0;
	margin: 0;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;

}



.button-parent {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 40px;
	z-index: 2;
	color: #fefcf2;
}

.div-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	text-align: center;
	font-size: 16px;
	color: #000;
	font-family: Inter;
}

.call-button {
	color: inherit;
	text-decoration: none;
}

.contact-no {
	position: relative;
	line-height: 28px;
}

/* Hide hamburger by default (desktop) */
.menu-toggle {
	display: none;
}

/* Hide close button on desktop */
.close-menu {
	display: none;
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
}

/* Mobile nav behavior */
@media (max-width: 768px) {
	nav {
		position: fixed;
		top: 0;
		right: -100%;
		/* hidden off screen */
		width: 70%;
		height: 100%;
		background: #fff;
		flex-direction: column;
		padding: 20px;
		transition: right 0.3s ease;
		box-shadow: -2px 0 6px rgba(0, 0, 0, 0.2);
		z-index: 999;
	}

	nav.show {
		right: 0;
		/* slide in */
	}

	.nav-links {
		flex-direction: column;
		gap: 20px;
		/* margin-top: 40px; */
	}

	.close-menu {
		display: block;
		align-self: flex-end;
	}
}






/* Hero Section - Start */

.hero-section {
	position: relative;
	display: flex;
	flex-direction: row;
	gap: 160px;
	top: 220px;
	scroll-margin-top: 800px;
}


.hero-left {
	position: relative;
	top: 60px;
	left: 120px;
	width: 655px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 20px;
	font-size: 48px;
	color: #000;
	font-family: Pacifico;
}

.hero-content {
	align-self: stretch;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.hero-title {
	position: relative;
	letter-spacing: -0.02em;
	line-height: 52px;
}

.hero-description {
	position: relative;
	font-size: 24px;
	letter-spacing: -0.02em;
	line-height: 40px;
	font-family: Domine;
}

.hero-sub-heading-1 {
	font-family: Domine;
	color: #151714;
	font-size: 16px;
}

.hero-sub-heading-2 {
	font-family: Domine;
	color: #201C3F;
	font-size: 16px;
	font-weight: 900;
	text-decoration: none;
}

.hero-sub-heading-2:hover {
	color: #02468f;
	transform: scale(1.1);
}

.information {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	max-width: 900px;
	font-size: 20px;
	font-family: Outfit;
}

.info-group {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	gap: 8px;
}

.timing {

	flex: 1;
	position: relative;
	align-self: stretch;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.address {
	width: 516px;
	position: relative;
	line-height: 24px;
	display: inline-block;
	flex-shrink: 0;
}


.primary-cta {
	/*background-color: #007BFF;*/
	/*background-color: #235789;*/
		background-color: #f6fb44;
		font-family: Outfit;
	/*color: #fefcf2;*/
	color: white;
    border: 2px solid #235789;
	padding: 12px 24px;
	font-size: 20px;
	white-space: nowrap;
	border-radius: 8px;
	cursor: pointer;
	display: inline-block;
	margin-left: 10px;

}

.primary-cta:hover {
	/*background-color: #0056b3;*/
	background-color:#fefcf2;
	transform: scale(1.08);
	/* Slightly darker on hover */
}
a {
  text-decoration: none; /* Removes underline */
  color: black; /* Optional: changes link color */
}

.secondary-cta {
	color: #235789;
	border: 2px solid #235789;
	padding: 10px 20px;
	font-size: 20px;
	text-decoration: none;
	/* removes underline */
	border-radius: 8px;
	display: inline-block;
	white-space: nowrap;
	transition: all 0.3s ease;
}

.secondary-cta:hover {
	background-color: #f5faff;
	color: #007BFF;
	transform: scale(1.05);
}



.hero_right {
	position: relative;
	/* right: 80px; */
	width: 560px;
	height: 560px;
	/* object-fit: cover; */
}


/* Animation for hero section text */
@keyframes fadeInSlideUp {
	0% {
		opacity: 0;
		transform: translateY(20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Apply animation to the main title and description */
.hero-title {
	animation: fadeInSlideUp 1s ease-out;
}

.hero-description {
	animation: fadeInSlideUp 1.2s ease-out;
}

/* Add hover effect to the address container to provide feedback */
.info-group:hover {
	cursor: pointer;
	transform: translateY(-2px);
	/* Lifts the container slightly */
	transition: transform 0.2s ease-in-out;
}

/* Add a subtle bounce and color change to the location icon on hover */
.info-group:hover .bi-geo-alt {
	animation: bounce 0.6s ease-in-out;
	color: #333;
	/* Darkens the icon slightly */
}

.hero_right {
	transition: transform 0.3s ease-in-out;
}

.hero_right:hover {
	transform: perspective(500px) rotateY(5deg) scale(1.05);
}

@keyframes bounce {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-5px);
		/* A small upward bounce */
	}
}

/* Add a hover effect to the timing container */
.info-group:hover .bi-clock {
	animation: rotate 1s infinite;
	/* A subtle rotation effect on hover */
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* Hero Section - end*/




/* All Bgs */
.about_bg {
	position: absolute;
	top: 800px;
	left: 0px;
	width: 100%;
	/* background-size: cover;
		background-repeat: no-repeat;
		background-position: top; */
	height: 5000px;
}

.hero_bg_2 {
	position: absolute;
	top: 660px;
	left: 237px;
	width: 380px;
	height: 364px;
	object-fit: cover;
}

.about_group_pic {
	position: relative;
	top: 940px;
	left: -50px;
	width: 1600px;
	object-fit: contain;
}

.service_bg {
	position: absolute;
	top: 1668px;
	left: 0px;
	width: 100%;

	background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
	height: 4000px;
}

.gallery_bg {
	position: absolute;
	top: 3665px;
	left: 0px;
	width: 100%;
	height: 1780px;
}

.team_bg {
	position: absolute;
	top: 2690px;
	left: 0px;
	width: 100%;
}

.desktop-7-inner {
	position: absolute;
	top: 4700px;
	left: 0px;
	width: 100%;
	height: 1200px;
}

.section-heading {
	align-self: stretch;
	position: relative;
	letter-spacing: -0.01em;
	line-height: 52px;
}



.learn-more {
	position: relative;
	line-height: 20px;
	font-weight: 500;
}

.button {
	width: 127px;
	border-radius: 10px;
	background-color: #235789;
	height: 40px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	box-sizing: border-box;
	text-align: left;
	color: #fefcf2;
}

.button:hover {
	transform: scale(1.1);
	background-color: #0056b3;
}











/* Our Services Section - Start */
.our-services {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	scroll-margin-top: 120px;
	/* max-width: 1240px; */
	margin-top: 660px;
	justify-content: flex-start;
	padding: 0 20px;
}

/* Wrapper with arrows */
.services-wrapper {
	position: relative;
	width: 100%;
	max-width: 1240px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Scroll area */
.all-services {
	display: flex;
	overflow-x: auto;
	scroll-behavior: smooth;
	gap: 40px;
	/* spacing between cards */
	scrollbar-width: none;
}

.all-services::-webkit-scrollbar {
	display: none;
}

/* Service card (your design preserved) */
.service-card {
	flex: 0 0 auto;
	width: 360px;
	height: 420px;
	border-radius: 16px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
	overflow: hidden;
	position: relative;
	/* transition: transform 0.3s ease, box-shadow 0.3s ease; */

	transition: transform 0.4s ease, filter 0.4s ease;
	cursor: pointer;
}


.service-card:hover {
	transform: scale(1.05);
	filter: brightness(0.65);
}



.s1 {
	background-image: url("asset/services/service_1.webp");
}

.s2 {
	background-image: url("asset/services/service_2.webp");
}

.s3 {
	background-image: url("asset/services/service_3.webp");
}

.servicecontent {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 320px;
	background: rgba(66, 56, 25, 0.6);
	color: #fff;
	padding: 15px 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.s-card-heading {
	font-size: 20px;
	line-height: 24px;
	font-family: Domine, serif;
	font-weight: bold;
}

.s-card-descr {
	font-size: 15px;
	line-height: 20px;
	font-family: Outfit, sans-serif;
}

/* Arrows */
.arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0, 0, 0, 0.5);
	color: #fff;
	border: none;
	font-size: 28px;
	padding: 8px 12px;
	border-radius: 50%;
	cursor: pointer;
	z-index: 2;
}

.arrow.left {
	left: -50px;
}

.arrow.right {
	right: -50px;
}








/* our team - S */
.our-team {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 120px;
	padding: 80px 40px;
	box-sizing: border-box;
	font-size: 15px;
	font-family: Outfit;
	top: 550px;
}

.ot-card {
	border-radius: 40px;
	background-color: rgba(255, 255, 255, 0.8);
	border: 1px solid #fde047;
	box-sizing: border-box;
	width: 60%;
	/* responsive width */
	max-width: 700px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: 28px 32px;
	margin-right: 480px;
	gap: 20px;
}


.ot-title {
	color: #d72600;
}
























/* Desc still collapsible */
.desc {
	list-style: none;
	font-size: 16px;
	margin-top: 20px;
	font-family: Outfit;
	color: #28261b;

	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: all 0.3s ease;
}

.desc.expanded {
	-webkit-line-clamp: unset;
	line-clamp: unset;
	display: block;
}

.desc li {
	margin-bottom: 20px;
	font-size: 16px;
	line-height: 20px;
	max-width: 100%;
}


.toggle-btn {
	border: none;
	background: none;
	font-size: 20px;
	cursor: pointer;
	color: #333;
}


.vector-icon1 {
	position: absolute;
	top: calc(50% - 250px);
	left: 842px;
	width: 500px;
	height: 500px;
	object-fit: cover;
}

.button3 {
	position: absolute;
	bottom: 69.5px;
	left: calc(50% + 318.5px);
	border-radius: 10px;
	background-color: #235789;
	color: #fefcf2;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	cursor: pointer;
	text-align: left;
	font-size: 16px;
}

.butto3:hover {
	transform: scale(1.1);
	background-color: #0056b3;
}

/* our team - E */










/* .about-us {
	top: 1100px;
	left: calc(50% - 453px);
	height: 472px;
	border-radius: 10px;
	background-color: #fefefe;
} */


/* About */
.about-us {
	position: relative;
	top: 160px;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	scroll-margin-top: 120px;
}

.about-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	margin-top: 0px;
	margin-bottom: 32px;
}

.about-descr {
	list-style: none;
	padding-left: 0;
	margin: 0;
	font-family: Inter;
	width: 907px;
	position: relative;
	font-size: 20px;
}

.about-descr li {
	margin-bottom: 20px;
	font-size: 20px;
	line-height: 30px;
	max-width: 100%;
}

/* About - E */



/* About - animation S */

/* Initial hidden state */
.about-descr li {
	opacity: 0;
	transform: translateX(0);
	transition: all 0.8s ease;
}

/* Slide in from right */
.slide-right.animate {
	animation: slideInRight 0.8s forwards;
}

/* Slide in from left */
.slide-left.animate {
	animation: slideInLeft 0.8s forwards;
}

/* Keyframes */
@keyframes slideInRight {
	from {
		transform: translateX(100px);
		opacity: 0;
	}

	to {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes slideInLeft {
	from {
		transform: translateX(-100px);
		opacity: 0;
	}

	to {
		transform: translateX(0);
		opacity: 1;
	}
}

/* About - animation E */






/* GALLERY */

.gallery-wrap {
	--btn-bg: rgba(0, 0, 0, 0.45);
	--btn-hover: rgba(0, 0, 0, 0.75);
	position: relative;
	overflow: hidden;
	max-width: 100%;
	margin: 0 auto 40px;
}

.scroller {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-behavior: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.scroller::-webkit-scrollbar {
	display: none;
}

/* ✅ Responsive image sizing */
.scroller img {
	flex: 0 0 auto;
	height: 300px;
	width: auto;
	object-fit: cover;
	border-radius: 12px;
	background: #111;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
}

@media (max-width:1024px) {
	.scroller img {
		height: 250px;
	}
}

@media (max-width:768px) {
	.scroller img {
		height: 200px;
	}
}

@media (max-width:480px) {
	.scroller img {
		height: 150px;
	}
}

/* Arrows */
.arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	border: none;
	background: var(--btn-bg);
	color: #fff;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	font-size: 26px;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}

.arrow:hover {
	background: var(--btn-hover);
}

.arrow-left {
	left: 10px;
}

.arrow-right {
	right: 10px;
}

.Gallery-Section {
	position: relative;
	/* z-index: 10; */
	top: 1060px;
	max-width: 100%;
	padding: 40px 20px;
}

.gallery-bento-grid img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 12px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover effect */
.gallery-bento-grid img:hover {
	transform: scale(1.05);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}












/* GET IN TOUCH - Start */

.get-in-touch_heading {
	position: relative;
	letter-spacing: -0.01em;
	line-height: 40px;
}

.get-in-touch_description {
	position: relative;
	font-size: 20px;
	line-height: 24px;
	font-family: Sen;
}

.get-in-touch {
	/* scroll-margin-top: 120px; */
	position: relative;
	top: 1300px;
	border-radius: 40px;
	width: 100%;
	max-width: 860px;
	margin: 0 auto;
	align-items: center;
	padding: 40px 20px;
	box-sizing: border-box;
	gap: 48px;
	background-image: url('asset/get in touch.webp');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	font-size: 34px;
	color: #423819;
	font-family: 'Domine', 'Outfit';
	scroll-margin-top: 120px;
}

.form {
	/* height: 320px; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 16px;
	max-width: 600px;
	margin: 0 auto;
	text-align: left;
	font-size: 15px;
	color: rgba(66, 56, 25, 0.4);
	font-family: Sen;
}

.inputstandard {
	width: 100%;
	height: 38px;
	padding: 8px 12px;
	border-radius: 8px;
	background-color: rgba(222, 218, 207, 0.4);
	border: 1px solid rgba(36, 34, 25, 0.16);
	box-sizing: border-box;
	font-size: 15px;
	font-family: Sen;
	display: block;
	/* Fixes layout issue */
}

.inputmultiline {
	width: 100%;
	min-height: 124px;
	padding: 8px 12px;
	border-radius: 8px;
	background-color: rgba(222, 218, 207, 0.4);
	border: 1px solid rgba(36, 34, 25, 0.16);
	box-sizing: border-box;
	font-size: 15px;
	font-family: Sen;
	resize: vertical;
	display: block;
}

.buttonfilledstandard {
	border-radius: 8px;
	background-color: #235789;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	color: #fefcf2;
	font-family: 'DM Mono';
}

.buttonfilledstandard:hover {
	transform: scale(1.1);
	background-color: #00346b;
}



/* Footer - S */


.image-10-icon {
	position: relative;
	max-height: 100%;
	object-fit: cover;
}



.footer-heading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	font-size: 24px;
	color: #28261b;
	font-family: Pacifico;
}

.description {
	position: relative;
	letter-spacing: -0.02em;
	line-height: 24px;
	color: #281d1b;
}

.facebook-icon {
	width: 24px;
	position: relative;
	height: 24px;
	overflow: hidden;
	flex-shrink: 0;
}

.socials {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 28px;
}

.ph-icon {
	width: 20px;
	position: relative;
	max-height: 100%;
	overflow: hidden;
	flex-shrink: 0;
}

.ph-no {
	position: relative;
	line-height: 28px;
	font-weight: 500;
}

.phone-number {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.contact-number {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
}

.learning-lane-springfield {
	width: 419px;
	position: relative;
	line-height: 24px;
	display: inline-block;
	flex-shrink: 0;
}

.address {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	gap: 8px;
}

.footer-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
}

.footer-content-wrapper {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
}

.home_footer {
	position: relative;
	top: 1320px;
}

.footer {
	top: 1320px;
	width: 100%;
	position: relative;
	height: 531px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: 206px 80px 130px;
	box-sizing: border-box;
	background-image: url('asset/Bg/Footer.webp');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
	text-align: center;
	font-size: 16px;
	color: #000;
	font-family: Outfit;
}




/* Floating Action Button Container */
.fab-container {
	position: fixed;
	bottom: 20px;
	right: 20px;
}

.whatsapp-button {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 60px;
	height: 60px;
	background-color: #28a745;
	border-radius: 50%;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	z-index: 1000;
}

.whatsapp-button img {
	width: 40px;
	height: 40px;
}

.whatsapp-button:hover {
	background-color: #218838;
	box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2);
}




/* Footer */
.events {
	position: relative;
	line-height: 20px;
	/* font-weight: 500; */
	cursor: pointer;
}




/* -----Copyrihts----- */
.copyrights-section {
	width: 100%;
	height: 40px;
	position: relative;

	background-color: #f9f5c3;
	/* background-color: #0B7605; */
	overflow: hidden;
	text-align: center;
	font-size: 14px;
	color: #000;
	font-family: Inter;
}

.copyrights-txt {
	margin-top: 12px;
	/* color: white; */

}

.g2g-technologies {
	text-decoration: none;
	color: #2a276b;
	font-weight: 900;
	margin-left: 4px;
	font-size: 15px;
}


.glow {
	display: inline-block;
	transition: text-shadow 0.4s ease, transform 0.3s ease;
}

.glow:hover {
	text-shadow:
		0 0 2px #a29fe0,
		0 0 4px #a29fe0,
		0 0 8px #a29fe0;
	transform: scale(1.05);
}





















/* Mobile */

@media (max-width: 768px) {


	.desktop-4 {
		width: 100%;
		position: absolute;
		height: 3595px;
		overflow: hidden;
		text-align: center;
		font-family: Domine;
		color: #28261b;
	}

	.section-header {
		gap: 0px;
	}

	.heading {
		font-size: 24px;
	}

	.sub-heading {
		font-size: 14px;
		font-weight: 100;
		opacity: 0.7;
		margin: 0px;
	}

	.desktop-4-child {
		position: absolute;
		top: 0px;
		left: -20px;
		width: 600px;
		height: 160px;
	}




	/* --- base: button hidden on desktop --- */
	.menu-toggle {
		display: none;
		background: transparent;
		border: 0;
		font-size: 28px;
		line-height: 1;
		cursor: pointer;
		padding: 6px;
		color: #281d1b;
	}

	/* Make sure nav ul can be targeted */
	nav .nav-links {
		list-style: none;
		font-weight: 200;
		display: flex;
		gap: 16px;
		padding: 0;
		margin: 0;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		z-index: 1;
	}

	/* --- MOBILE / TABLET --- */
	@media (max-width: 900px) {

		/* keep header compact */
		.nav-bar {
			padding: 14px 16px;
			gap: 12px;
		}

		/* show hamburger */
		.menu-toggle {
			display: inline-flex;
			margin-left: auto;
			/* pushes it to the right */
			z-index: 1101;
			/* above the slideout panel */
		}

		/* hide the right-side button on mobile (optional) */
		.button-parent {
			display: none;
		}

		/* slide-out panel */
		.nav-bar nav {
			position: fixed;
			top: 0;
			right: 0;
			height: 100vh;
			width: 80%;
			max-width: 320px;
			background: rgba(248, 239, 190, 0.97);
			box-shadow: -10px 0 30px rgba(0, 0, 0, .12);
			transform: translateX(100%);
			transition: transform 0.3s ease;
			padding: 90px 24px 24px;
			/* space for fixed header area */
			z-index: 1100;
		}

		/* links stacked vertically inside slideout */
		nav .nav-links {
			flex-direction: column;
			align-items: flex-start;
			gap: 18px;
		}

		/* open state */
		.nav-bar.open nav {
			transform: translateX(0);
		}

		/* toggle icon swap */
		.nav-bar.open .menu-toggle .bi-list {
			display: none;
		}

		.nav-bar.open .menu-toggle .bi-x-lg {
			display: inline-block;
		}

		.menu-toggle .bi-x-lg {
			display: none;
		}

		/* brand text can wrap but don’t overflow */
		.brand-name {
			white-space: normal;
			word-break: break-word;
			max-width: 220px;
			/* adjust if needed */
			font-size: 16px;
		}


	}

	/* Prevent body scroll when menu open */
	body.nav-open {
		overflow: hidden;
	}











	/* Responsive hero section */
	.hero-section {
		flex-direction: column;
		align-items: center;
		gap: 20px;
		top: 140px;
		padding: 0 20px;
	}

	.hero-left {
		top: 0;
		left: 0;
		width: 320px;
		align-items: center;
		text-align: center;
		font-size: 28px;
		/* shrink title */
		gap: 16px;
	}

	.hero-content {
		gap: 4px;
	}

	.hero-title {
		font-size: 24px;
		line-height: 34px;
		width: 360px;
	}

	.hero-sub-heading-1 {
		font-size: 10px;
	}

	.hero-sub-heading-2 {
		font-size: 10px;
	}

	.hero-description {
		font-size: 18px;
		line-height: 26px;

	}

	.information {
		font-size: 14px;
		gap: 4px;
	}

	.address {
		width: 300px;
		font-size: 14px;
		line-height: 20px;
		text-align: center;
	}

	.hero_right {
		width: 100%;
		max-width: 320px;
		/* keep it manageable */
		height: auto;
	}

	.primary-cta {
		font-size: 16px;
	}

	.ot-button {
		font-size: 12px;
		padding: 6px 12px;
	}

	.secondary-cta {
		display: none;
	}


	.hero_bg_2 {
		position: absolute;
		top: 660px;
		left: 220px;
		width: 160px;
		height: 153px;
		object-fit: cover;
	}


	/* About Section */
	.about_bg {
		position: absolute;
		top: 720px;
		width: 100%;
		height: 800px;
		object-position: top;
		display: block;
		object-fit: cover;

		/* background-image: url("your-image.jpg");
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat; */

	}

	.about-us {
		top: 180px;
		gap: 0px;
	}

	.about-descr {
		width: 316px;
	}

	.about-descr li {
		margin-bottom: 20px;
		font-size: 14px;
		line-height: 24px;
		max-width: 100%;

	}

	.about_group_pic {
		top: 794px;
		width: 420px;
		left: 0px
	}



	.service_bg {
		position: absolute;
		top: 1386px;
		width: 100%;
		height: 800px;
		object-position: top;
		display: block;
		object-fit: cover;

	}

	/* Service - S */

	.servicecontent {
		width: 260px;
		gap: 4px;
	}

	.s-card-heading {
		font-size: 20px;
	}



	/* Our Services Section - Start */
	.our-services {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		scroll-margin-top: 120px;
		margin-top: 380px;
		justify-content: flex-start;
		padding: 0px;
	}

	/* Wrapper with arrows */
	.services-wrapper {
		position: relative;
		width: 100%;
		max-width: 1240px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* Scroll area */
	.all-services {
		display: flex;
		overflow-x: auto;
		scroll-behavior: smooth;
		gap: 0px;
		/* spacing between cards */
		scrollbar-width: none;
		padding: 0px 20px;
	}




	.all-services::-webkit-scrollbar {
		display: none;
	}

	/* Service card (your design preserved) */
	.service-card {
		flex: 0 0 auto;
		width: 260px;
		height: 320px;
		border-radius: 16px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: top;
		overflow: hidden;
		position: relative;
		/* transition: transform 0.3s ease, box-shadow 0.3s ease; */

		transition: transform 0.4s ease, filter 0.4s ease;
		cursor: pointer;
	}

	.servicecontent {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 220px;
		background: rgba(66, 56, 25, 0.6);
		color: #fff;
		padding: 15px 20px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}










	.team_bg {
		top: 1980px;
	}

	/* our team - S */
	.our-team {
		justify-content: flex-start;
		padding: 80px 20px;
		font-size: 15px;
		top: 110px;
	}

	.ot-card {
		border-radius: 20px;
		width: 60%;
		/* responsive width */
		/* max-width: 900px; */
		/* padding: 8px 12px; */
		padding: 30px 16px 20px;
		margin-right: 180px;
		gap: 4px;
	}

	.ot-title {
		line-height: 8px;
		margin-top: 20px;
		font-size: 12px;
		margin-bottom: 6px;
	}

	.ot-desc {
		display: none;
	}

	/* Desc still collapsible */
	.desc,
	.desc li {
		font-size: 12px;
		margin-top: 10px;
	}

	.toggle-btn {
		margin-top: 0px;
	}

	.vector-icon1 {
		top: 66px;
		left: 180px;
		width: 180px;
		height: 180px;
		object-fit: cover;
	}

	.button3 {
		position: relative;
		top: 80px;
		margin-top: 20px;
		left: -180px;
		border-radius: 8px;
		padding: 6px 12px;
		font-size: 12px;
	}

	/* our team - S */



	/* M-gallery - S */

	.gallery_bg {
		top: 2254px;
		height: 538px;
	}

	.Gallery-Section {
		top: 120px;
	}

	/* gallery - E */





	/* M- GET IN TOUCH -Start */

	.desktop-7-inner {
		top: 2648px;
		height: 500px;
	}

	.get-in-touch {
		top: 180px;
		max-width: 320px;
	}

	.get-in-touch_description {
		font-size: 14px;
		line-height: 16px;
		opacity: 0.7;
	}

	.buttonfilledstandard {
		border-radius: 8px;
		background-color: #235789;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		padding: 8px 16px;
		color: #fefcf2;
		font-family: 'DM Mono';
	}

	.inputmultiline {
		width: 100%;
		height: 24%;
		min-height: 50px;
	}


	/* Footer */

	.footer {
		top: 210px;
		font-size: 16px;
	}

	.home_footer {
		position: relative;
		top: 100px;
	}

	.brand-name {
		letter-spacing: -0.04em;
		line-height: 100%;
	}

	.logo {
		height: 32px;
		gap: 4px;
	}

	.footer-heading {
		font-size: 24px;
	}

	.description {
		letter-spacing: -0.02em;
		line-height: 18px;
	}

	.facebook-icon {
		width: 24px;
		height: 24px;
	}

	.socials {
		gap: 28px;
	}

	.ph-icon {
		width: 20px;
	}

	.ph-no {
		line-height: 20px;
		font-weight: 300;
	}

	.phone-number {
		gap: 8px;
	}

	.contact-number {
		gap: 10px;
	}

	.learning-lane-springfield {
		width: 260px;
		line-height: 16px;
		font-size: 12px;
	}

	.address {
		gap: 0px;
	}

	.footer-content {
		gap: 8px;
	}

	.arrow {
		display: none;
	}


	/* -----copyrights----- */

	.cr-home{
		width: 100%;
		position: absolute;
		top: 3594px;
	}

	.copyrights-section {
		font-size: 10px;
		height: auto;
	}

	.copyrights-txt {
		margin: 6px;
	}

	.g2g-technologies {
		text-decoration: none;
		color: #2a276b;
		font-weight: 900;
		margin-left: 4px;
		font-size: 12px;
	}
}



/* Copyright-Mobile auto glow animation */
@media (hover: none) {
  .glow {
    animation: blink 2s infinite alternate;
  }
}

@keyframes blink {
  0% {
    text-shadow: none;
    transform: scale(1);
  }
  100% {
    text-shadow:
      0 0 2px #a29fe0,
      0 0 4px #a29fe0,
      0 0 8px #a29fe0;
    transform: scale(1.05);
  }
}
