.featured-courses {
	background: linear-gradient(180deg, rgba(43, 128, 144, 1) 0%, rgba(22, 93, 109, 1) 40%, rgba(0, 56, 71, 1) 83%);
	position: relative;
	overflow: hidden;
}

.course-card {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	height: 100%;

	width: 350px;
	/* desktop width */
	height: 450px;
	/* desktop height */

	max-width: 100%;
	/* card never exceeds container */
	margin: auto;
	/* center on smaller screens */
}

.course-img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

/* Default Info */
.course-info {
	position: absolute;
	top: 0;
	/* make it cover full card */
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	/* split vertically */
	flex-direction: column;
	justify-content: space-between;
	/* push top + bottom apart */
	padding: 15px;
	color: #fff;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
	transition: opacity 0.3s ease;
}

.course-category {
	font-size: 0.75rem;
	text-transform: uppercase;
	opacity: 0.9;
}

.course-title {
	font-size: 1.125rem;
	font-weight: bold;
	margin: 5px 0;
}

.course-meta,
.course-rating {
	font-size: 0.85rem;
	opacity: 0.9;
}

/* Hover Overlay */
.course-hover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #004558CC;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.see-more-btn {
	font-weight: bold;
	border-radius: 50px;
	padding: 10px 20px;
}

/* Hover Effects */
.course-card:hover .course-img {
	transform: scale(1.1);
}

.course-card:hover .course-hover {
	opacity: 1;
}

.fa-lg {
	line-height: unset !important;
}

/* Top section */
.course-top h6 {
	font-size: 0.8rem;
	text-transform: uppercase;
	margin-bottom: 5px;
	opacity: 0.9;
}

.course-top h4 {
	font-size: 1.4rem;
	font-weight: 600;
	margin: 0;
}

/* Bottom section */
.course-bottom {
	display: flex;
	/* inline arrangement */
	justify-content: space-between;
	align-items: center;
	font-size: 0.85rem;
}

/* Divider right */
.custom-divider-right {
	background: #fff;
	position: relative;
	height: 32px;
	/* total height (teal + red + gap) */
}

.custom-divider-right::before,
.custom-divider-right::after {
	content: "";
	display: block;
	height: 13px;
	margin-left: auto;
	/* align to right */
}

.custom-divider-right::before {
	width: 70%;
	background: #004052;
}

.custom-divider-right::after {
	width: 60%;
	background: #CF7769;
}

/* Divider left */
.custom-divider-left {
	background: #fff;
	position: relative;
	/* height: 32px; */
	/* total height (teal + red + gap) */
}

.custom-divider-left::before,
.custom-divider-left::after {
	content: "";
	display: block;
	height: 13px;
}

.custom-divider-left::before {
	width: 70%;
	background: #69C9CF;
}

.custom-divider-left::after {
	width: 60%;
	background: #065268;
}


.booking-title {
	font-size: 4.4rem;
	font-weight: 600;
}

@media (max-width: 991.98px) {
	.booking-title {
		font-size: 30px;
	}
}


/* NSA Section */
.bg-light-teal {
	background-color: var(--aqua-blue);
}

.bg-dark-teal {
	background-color: var(--dark-teal);
}

.btn-outline-light-custom {
	border: 1px solid rgba(255, 255, 255, 0.5);
	background: rgba(255, 255, 255, 0.1);
}

.btn-outline-light-custom:hover {
	background: rgba(255, 255, 255, 0.2);
	border-color: white;
}

/* Image overlap styles */
.overlap-image {
	transform: translateX(140px);
	z-index: 10;
	width: 1000px;
}



/* Mobile responsive styles */
@media (max-width: 1199.98px) {
	.overlap-image {
		transform: translateX(150px) !important;
	}
}

@media (max-width: 991.98px) {
	.overlap-image {
		transform: none !important;
	}

	.mobile-order-2 {
		order: 2;
	}

	.mobile-order-1 {
		order: 1;
	}

	.ps-lg-custom {
		padding-left: 0 !important;
	}
}

@media (max-width: 768px) {
	.mobile-padding {
		padding: 2rem 1.5rem !important;
	}
}

@media (max-width: 576px) {
	.mobile-padding {
		padding: 1.5rem 1rem !important;
	}
}

/* Custom padding for different screen sizes */
@media (min-width: 1200px) {
	.ps-lg-custom {
		padding-left: 8rem !important;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.ps-lg-custom {
		padding-left: 2rem !important;
	}
}


  .icon-box {
    width: 70px;
    height: 70px;
  }
  .approach-card p {
    font-size: 0.95rem;
  }

  .logo-col img {
    max-height: 180px;
    -o-object-fit: contain;
       object-fit: contain;
  }