/* =========================================================
   media.css — responsive rules
   ========================================================= */

/* ========================================================= ≤ 410px — very small phones ========================================================= */
@media (max-width: 410px) {

	#slider .carousel,
	#slider .carousel-inner,
	#slider .carousel-item {
		min-height: 300px;
	}

	#slider .carousel-item img {
		width: 100%;
		height: 300px;
		object-fit: cover;
	}
}

/* ========================================================= < 768px — phones & small tablets (shared slider/service-box layout) ========================================================= */
@media (max-width: 767.98px) {

	#slider {
		position: relative !important;
		overflow: visible !important;
	}

	#slider .slider-box {
		max-width: 92vw !important;
		margin: 0 auto !important;
	}


	#slider .service-box h3.service_head,
	#slider .service-box p.service_sub {
		max-width: none !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		text-align: left;
	}

	/* service-box positioning + card layout (base for <768) */
	#slider .service-box {
		position: absolute !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%) !important;
		width: min(700px, 92vw) !important;
		box-sizing: border-box !important;
		padding: 22px 18px !important;
		bottom: -450px !important;
		z-index: 5;
	}

	#slider .service-box .container,
	#slider .service-box .row {
		max-width: none !important;
		width: 100% !important;
		margin: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#slider .service-box .slider_bottom_box {
		display: flex !important;
		flex-wrap: wrap !important;
	}

	#slider .service-box .slider_bottom_box .box {
		flex: 1 1 calc(25% - 12px) !important;
		padding: 14px 12px !important;
		border-radius: 12px !important;
	}

	#slider .service-box .slider_bottom_box .service_img {
		margin-bottom: 10px !important;
	}

	#slider .service-box .slider_bottom_box .service_img img {
		max-width: clamp(56px, 22vw, 90px) !important;
		height: auto !important;
		display: block;
	}

	#slider .service-box .slider_bottom_box h3.service_head,
	#slider .service-box .slider_bottom_box h5,
	#slider .service-box .slider_bottom_box .service_title {
		font-size: clamp(14px, 3.6vw, 16px) !important;
		line-height: 1.25 !important;
		margin: 0 0 6px !important;
	}

	#slider .service-box .slider_bottom_box p.service_sub,
	#slider .service-box .slider_bottom_box .service_text,
	#slider .service-box .slider_bottom_box p {
		font-size: clamp(12px, 3.2vw, 14px) !important;
		line-height: 1.45 !important;
		margin: 0 !important;
	}

	/* EVENT: small screens tighten */
	#event .event-body h5 {
		font-size: 26px;
	}

	#event .event-body p {
		line-height: 1.55;
	}
}

/* ========================================================= ≤ 575.98px — phones ========================================================= */
@media (max-width: 575.98px) {

	.nav_wrap,
	#header .main-header-box {
		position: relative;
		background: #fff;
		min-height: 10px;
		padding: 6px 12px;
		overflow: visible;
		z-index: 20;
	}

	#menu-left-menu,
	#menu-right-menu,
	.left_menu,
	.right_menu,
	.main-navigation,
	#site-navigation,
	.menubar .nav {
		display: none !important;
	}

	#header .logo {
		position: absolute !important;
		left: 50% !important;
		top: 58% !important;
		transform: translate(-50%, -50%) !important;
		margin: 0;
		padding: 0;
		z-index: 25;
	}

	#header .logo img {
		max-width: 90px !important;
		height: auto;
		display: block;
	}

	.mobile-menu {
		display: block !important;
	}

	.toggle-nav {
		display: block !important;
		position: absolute !important;
		left: 12px;
		right: auto;
		top: 58% !important;
		transform: translateY(-20%) !important;
		width: 38px;
		height: 38px;
		z-index: 30;
		cursor: pointer;
	}

	.toggle-nav i {
		font-family: "Font Awesome 5 Free" !important;
		font-weight: 900 !important;
		font-size: 26px;
		line-height: 38px;
		color: #1f1e1e;
		text-align: center;
	}

	.toggle-nav i.fa-bars:before {
		content: "\f0c9";
	}

	#header .socialbox {
		position: absolute !important;
		right: 28px;
		left: auto;
		top: 58% !important;
		transform: translateY(-25%) !important;
		display: flex !important;
		margin: 0 !important;
		padding: 0 !important;
		z-index: 28;
	}

	#header .socialbox a {
		width: 32px;
		height: 32px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	#mySidenav,
	.sidenav {
		display: block !important;
		position: fixed;
		top: 0;
		right: 0;
		height: 100%;
		width: 0;
		background: #111;
		overflow-x: hidden;
		transition: width .35s ease;
		z-index: 99999;
		padding-top: 72px;
	}

	#mySidenav .closebtn {
		position: absolute;
		top: 18px;
		right: 14px;
		font-size: 30px;
		color: #fff;
	}

	#mySidenav .main-navigation,
	#mySidenav nav,
	#mySidenav .menubar,
	#mySidenav .nav,
	#mySidenav .menu,
	#mySidenav ul {
		display: block !important;
	}

	#mySidenav ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	#mySidenav li {
		border-bottom: 1px solid rgba(255, 255, 255, .12);
	}

	#mySidenav a {
		display: block;
		padding: 12px 20px;
		color: #f7f7f7;
		text-decoration: none;
		font: 500 17px/1.4 "Roboto";
	}

	#mySidenav a:hover {
		color: #f0b450;
	}

	#mySidenav ul ul {
		display: block !important;
		position: static !important;
		background: transparent !important;
		min-width: auto !important;
		box-shadow: none !important;
		margin: 0;
		padding: 0;
	}

	#mySidenav ul ul a {
		padding-left: 34px;
		font-weight: 400;
		font-size: 16px;
		opacity: .95;
	}

	#header .socialbox {
		text-align: center;
	}

	.menubar {
		padding: 0 15px;
	}

	.home.page-template .site-header {
		position: unset;
	}

	.sticky {
		position: unset !important;
	}

	.header-nav {
		padding-top: 0;
	}

	#header {
		padding-bottom: 20px;
	}

	.header-nav .menubar {
		background-color: transparent;
	}

	.logo a {
		font-size: 23px;
	}

	#header .col-12 {
		text-align: center !important;
	}

	#topbar .topbar_section .container .row {
		display: flex;
		flex-wrap: nowrap;
		justify-content: flex-end !important;
	}

	#topbar .topbar-phone {
		margin-left: auto !important;
		justify-content: flex-end !important;
		text-align: right !important;
		padding-right: 40px;
		width: auto;
	}

	/* Slider on phones */
	#slider {
		position: relative !important;
		padding-bottom: 0 !important; /* overrides the 688px block */
	}

	#slider .service-box {
		position: absolute !important;
		left: 50% !important;
		transform: translateX(-50%) !important;
		z-index: 3;
		padding: 20px 15px !important;
		width: calc(100% - 30px) !important;
		max-width: 600px !important;
	}

	#slider .service-box h3.service_head {
		font-size: 24px;
		line-height: 1.25;
		margin: 0 0 8px;
	}

	#slider .service-box p.service_sub {
		width: 100% !important;
		text-align: left;
		font-size: 16px;
		line-height: 1.6;
	}

	.service_img {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.service_img img {
		color: #fff;
		max-width: clamp(80px, 55vw, 140px);
		height: auto;
		display: block;
		margin: 0 auto;
		object-fit: contain;
	}

	.box {
		text-align: center;
		padding: 20px;
	}

	/* HOW-IT-WORK: headings + diamond count center */
	#how-it-work .how-it-work-head h3 {
		font-size: 21px;
	}

	#how-it-work .how-it-work-head h3:before {
		top: 39px;
	}

	#how-it-work .how-it-work-head h3:after {
		left: 46%;
	}

	#how-it-work .box {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 96px !important;
		width: 96px !important;
	}

	#how-it-work .how-it-work-content p.count {
		padding: 0 !important;
		margin: 0 !important;
		line-height: 1 !important;
		font-size: 24px !important;
		transform: translateY(0) !important;
	}

	section {
		padding: 20px 0;
	}

	.post-date {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		min-height: 80px;
		background: #f4a261;
	}

	.post-date .month,
	.post-date .date {
		display: block;
		margin: 0;
		padding: 0;
		color: #fff;
		line-height: 1.2;
	}

	.post-date .month {
		font-size: 18px;
		font-weight: bold;
	}

	.post-date .date {
		font-size: 24px;
	}

	h3.service_head,
	p.service_sub,
	h5.service_title,
	p.service_text {
		text-align: center;
	}

	.service_img img {
		margin: 0 auto;
	}

	.media-small {
		padding-left: 10px !important;
	}

	.above_title {
		margin-top: 2%;
	}

	/* EVENT: phones */
	#event .event-row {
		gap: 22px;
	}

	#event .event-left,
	#event .event-right {
		flex: 0 0 100%;
		max-width: 100%;
	}

	#event .event-card {
		flex-direction: column;
	}

	#event .event-media {
		flex-basis: auto;
		max-width: none;
	}

	#event .event-sideimg img {
		max-height: none;
		aspect-ratio: auto;
		object-fit: contain;
	}

	#event .event-card {
		gap: 14px;
		padding: 18px 16px;
	}

	#event .event-media {
		max-width: 100%;
		align-self: center;
	}

	#event .event-media img {
		width: 100%;
		max-height: 220px;
		aspect-ratio: 4 / 3;
		object-fit: cover;
		border-radius: 12px;
	}

	#event .event-body h5 {
		font-size: 22px;
	}

	#event .event-body p {
		font-size: 15px;
		line-height: 1.55;
	}

	/* stack slider bottom cards one per row on phones */
	#slider .service-box .slider_bottom_box .box {
		flex: 1 1 100% !important;
	}

	/* lift service-box + keep Latest News from sitting on it */
	#slider .service-box {
		bottom: -540px !important;
	}

	#latest_news {
		padding-top: 0 !important;  /* overrides the 688px block */
		margin-top: 150px;
	}
}

/* ========================================================= 576–767.98px — small tablets ========================================================= */
@media (min-width:576px) and (max-width:767.98px) {

	.nav_wrap,
	#header .main-header-box {
		position: relative;
		background: #fff;
		min-height: 34px;
		padding: 8px 14px;
		overflow: visible;
		z-index: 20;
	}

	.mobile-menu {
		display: block !important;
	}

	.toggle-nav {
		display: block !important;
		position: absolute !important;
		left: 12px;
		right: auto;
		top: 58% !important;
		transform: translateY(-30%) !important;
		width: 38px;
		height: 38px;
		z-index: 30;
		cursor: pointer;
	}

	.toggle-nav i {
		font-family: "Font Awesome 5 Free" !important;
		font-weight: 900 !important;
		font-size: 22px;
		line-height: 44px;
		text-align: center;
		color: #1f1e1e;
	}

	#header .socialbox {
		position: absolute !important;
		right: -42px;
		left: auto;
		top: 58% !important;
		transform: translateY(-30%) !important;
		display: flex !important;
		margin: 0 !important;
		padding: 0 !important;
		z-index: 28;
	}

	#header .socialbox a {
		width: 32px;
		height: 32px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	#menu-left-menu,
	#menu-right-menu,
	.left_menu,
	.right_menu,
	.main-navigation,
	#site-navigation,
	.menubar .nav {
		display: none !important;
	}

	#header .logo {
		position: absolute !important;
		left: 150% !important;
		top: 64% !important;
		transform: translate(-50%, -50%) !important;
		margin: 0;
		padding: 0;
		z-index: 25;
	}

	#header .logo img {
		max-width: 100px !important;
		height: auto;
		display: block;
	}

	#mySidenav,
	.sidenav {
		display: block !important;
		position: fixed;
		top: 0;
		right: 0;
		height: 100%;
		width: 0;
		background: #111;
		overflow-x: hidden;
		transition: width .35s ease;
		z-index: 99999;
		padding-top: 72px;
	}

	#mySidenav .closebtn {
		position: absolute;
		top: 18px;
		right: 14px;
		font-size: 30px;
		color: #fff;
	}

	#mySidenav .main-navigation,
	#mySidenav nav,
	#mySidenav .menubar,
	#mySidenav .nav,
	#mySidenav .menu,
	#mySidenav ul {
		display: block !important;
	}

	#mySidenav ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	#mySidenav li {
		border-bottom: 1px solid rgba(255, 255, 255, .12);
	}

	#mySidenav a {
		display: block;
		padding: 12px 20px;
		color: #f7f7f7;
		text-decoration: none;
		font: 500 17px/1.4 "Roboto";
	}

	#mySidenav a:hover {
		color: #f0b450;
	}

	#mySidenav ul ul {
		display: block !important;
		position: static !important;
		background: transparent !important;
		min-width: auto !important;
		box-shadow: none !important;
		margin: 0;
		padding: 0;
	}

	#mySidenav ul ul a {
		padding-left: 34px;
		font-weight: 400;
		font-size: 16px;
		opacity: .95;
	}

	#slider {
		position: relative !important;
		overflow: visible !important;
	}

	#latest_news {
		padding-top: 30px !important;
	}

	#how-it-work .row {
		flex-wrap: wrap;
	}

	#how-it-work .how-it-work-content {
		text-align: center;
		margin-bottom: 24px;
	}

	#how-it-work .how-it-work-content p {
		max-width: 280px;
		margin: 0 auto;
	}

	#courses .content_bottom span.price {
		padding: 0;
	}

	#courses .course_head h3 {
		font-size: 25px;
	}

	#event .event_head h4 {
		font-size: 14px;
	}

	#event .event_head h3 {
		font-size: 30px;
	}

	#event .event-row {
		gap: 24px;
	}

	#event .event-left,
	#event .event-right {
		flex: 0 0 100%;
		max-width: 100%;
	}

	#event .event-card {
		flex-direction: column;
	}

	#event .event-media {
		flex-basis: auto;
		max-width: none;
	}

	#event .event-sideimg img {
		max-height: none;
		aspect-ratio: auto;
		object-fit: contain;
	}

	#event .event-card {
		gap: 16px;
		padding: 20px 18px;
	}

	#event .event-media img {
		max-height: 260px;
		aspect-ratio: 4/3;
		object-fit: cover;
	}

	#event .event-body h5 {
		font-size: 24px;
	}
}

/* ========================================================= < 688px — push the service box further down and keep room for it ========================================================= */
@media (max-width: 688px) {

	#slider {
		position: relative !important;
		padding-bottom: 100px !important;
		overflow: visible !important;
	}

	#slider .service-box {
		bottom: -474px !important;
		left: 50% !important;
		transform: translateX(-50%) !important;
		width: min(680px, 94vw) !important;
		box-sizing: border-box !important;
		padding: 22px 16px !important;
		z-index: 5;
	}

	#latest_news {
		padding-top: 330px !important;
	}
}

/* ===== < 632px — a bit more room ===== */
@media (max-width: 632px) {
	#slider .service-box {
		bottom: -490px !important;
	}
}

/* ===== service-box spacing tweaks ===== */
@media (min-width: 576px) and (max-width: 591px) {
	#slider .service-box {
		bottom: -500px !important;
	}
}

@media (max-width: 558px) {
	#slider .service-box {
		bottom: -540px !important;
	}
}

@media (max-width: 430px) {
	#slider .service-box {
		bottom: -578px !important;
	}
}

@media (max-width: 381px) {
	#slider .service-box {
		bottom: -626px !important;
	}
}

/* ========================================================= 768–991.98px — tablets / compressed desktop ========================================================= */
@media (min-width:768px) and (max-width:991.98px) {

	#header .main-header-box .row {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
	}

	#header .main-header-box .row>[class*="col-"] {
		flex: 1 1 0 !important;
		max-width: none !important;
	}

	.left_menu,
	.right_menu {
		display: flex !important;
		align-items: center !important;
	}

	.mobile-menu,
	.toggle-nav {
		display: none !important;
	}

	.main-navigation ul,
	.menubar .nav ul {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.menubar .nav ul li {
		display: inline-block !important;
		width: auto !important;
		border: 0 !important;
		padding: 14px 0 !important;
	}

	.menubar .nav ul li+li {
		margin-left: 24px;
	}

	#menu-left-menu>li>a,
	#menu-right-menu>li>a,
	.main-navigation a {
		font: 400 18px/1 "Roboto" !important;
		color: #000 !important;
		text-decoration: none;
		white-space: nowrap;
		display: inline-block;
		position: relative;
	}

	#menu-left-menu>li>a:before,
	#menu-right-menu>li>a:before {
		bottom: 0 !important;
		left: 46% !important;
		transform: translateX(-50%) !important;
	}

	#header .logo img {
		max-width: 120px;
		max-height: 120px;
		padding-bottom: 5px;
		display: block;
	}

	#header .socialbox {
		margin-left: auto !important;
		padding: 0 !important;
		max-width: fit-content;
	}

	#header .socialbox a {
		width: 32px;
		height: 32px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	#header .right_menu {
		justify-content: flex-end;
		padding-left: 60px;
	}

	.menubar {
		padding-top: 0;
		padding-bottom: 0;
	}

	.header-nav {
		padding-top: 0;
	}

	#slider {
		position: relative;
		padding-bottom: 260px;
	}

	#slider .slider-box {
		max-width: 1100px;
		margin: 0 auto;
	}

	#slider .slider-box h1 {
		font-size: clamp(30px, 4.2vw, 40px);
		line-height: 1.1;
		max-width: 32ch;
		margin-top: 72px;
		white-space: normal;
		word-break: normal;
		hyphens: none;
	}

	#slider .slider-box .mission-toggle > summary {
		font-size: clamp(16px, 2.0vw, 20px);
		line-height: 1.22;
		max-width: 38ch;
		-webkit-text-stroke: 0;
		margin-right: 0px;
	}

	#slider .slider-box p {
		font-size: clamp(13px, 1.6vw, 18px);
		line-height: 1.45;
		max-width: 44ch;
		margin-left: 120px;
	}

	#slider .service-box {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		bottom: -400px;
		width: min(1040px, calc(100% - 12px)) !important;
		max-width: 1140px;
		padding: 40px 32px;
		z-index: 5;
	}

	/* EVENT — tablet */
	#event .event-row {
		gap: 26px;
	}

	#event .event-left,
	#event .event-right {
		flex: 0 0 100%;
		max-width: 100%;
	}

	#event .event-card {
		display: flex;
		flex-direction: row;
		gap: 18px;
		padding: 20px;
		align-items: flex-start;
	}

	#event .event-media {
		position: relative;
		flex: 0 0 40%;
		max-width: 40%;
		min-width: 260px;
	}

	#event .event-media img {
		width: 100%;
		height: 260px;
		object-fit: cover;
		object-position: 56% 24%;
		aspect-ratio: auto;
		border-radius: 12px;
		transform: none;
	}

	#event .post-date {
		position: absolute;
		top: 10px;
		left: 10px;
		transform: none;
		z-index: 1;
	}

	#event .event-body {
		flex: 1 1 0;
		min-width: 0;
	}

	#event .event-body h5 {
		font-size: 26px;
	}

	#event .event-body p {
		font-size: 15px;
		line-height: 1.55;
	}

	#event .event-sideimg {
		text-align: left;
	}

	#event .event-sideimg img {
		display: block;
		margin-left: 0;
		margin-right: auto;
		object-position: 40% center;
	}
}

/* ========================================================= 992–1199.99px — standard desktops (narrow) ========================================================= */
@media (min-width:992px) and (max-width:1199.99px) {

	#slider {
		position: relative;
		padding-bottom: 260px;
	}

	#slider .slider-box h1 {
		font-size: 40px;
		line-height: 1.05;
		max-width: 900px;
		margin: 0;
		margin-right: 158px;
		text-align: center;
		white-space: normal;
		overflow-wrap: normal;
		word-break: keep-all;
		hyphens: none;
	}

	#slider .slider-box p {
		margin-right: 180px;
	}

	#slider .service-box {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		width: min(1180px, calc(100% - 0px)) !important;
		bottom: -390px;
		z-index: 5;
		padding: 60px 40px;
	}

	/* EVENT — 992–1199.99 */
	#event .event-row {
		gap: 30px;
	}

	#event .event-left {
		flex: 0 0 56%;
		max-width: 56%;
	}

	#event .event-right {
		flex: 0 0 44%;
		max-width: 44%;
	}

	#event .event-card {
		padding: 20px 22px;
	}

	#event .event-media {
		flex: 0 0 210px;
		max-width: 210px;
	}

	#event .event-body h5 {
		font-size: 24px;
	}

	#event .event-body p {
		font-size: 15px;
	}

	#event .event-sideimg img {
		max-height: 460px;
		aspect-ratio: auto;
		object-fit: cover;
	}
}

/* ========================================================= 1200–1510px — standard desktops (wide) ========================================================= */
@media (min-width:1200px) and (max-width:1510px) {

	#slider {
		position: relative !important;
		padding-bottom: 450px !important;
		overflow: visible !important;
	}

	#slider .service-box {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		width: min(1140px, 92vw);
		bottom: -240px;
		z-index: 5;
		padding: 48px 40px;
	}

	#latest_news {
		margin-top: -260px !important;
	}
}

/* =========================================
   FIX: stop slider bottom cards from overflowing
   between ~992 and ~1510 widths
   ========================================= */
@media (min-width: 992px) and (max-width: 1510px) {

	#slider .slider_bottom_box .service_img {
		width: min(110px, 100%) !important;
		height: min(110px, 100%) !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		margin: 0 auto 12px !important;
	}

	#slider .slider_bottom_box .service_img img {
		max-width: 100% !important;
		max-height: 100% !important;
	}

	#slider .slider_bottom_box [class^="box-content"],
	#slider .slider_bottom_box .service-link,
	#slider .slider_bottom_box .box {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	#slider .slider_bottom_box .service_title,
	#slider .slider_bottom_box .service_text {
		width: 100% !important;
		max-width: 100% !important;
		white-space: normal !important;
		overflow-wrap: anywhere !important;
		word-break: break-word !important;
	}

	#slider .slider_bottom_box .box {
		padding: 16px 14px !important;
	}
}

/* ========================================================= 1511–1919px — large desktops ========================================================= */
@media (min-width:1511px) and (max-width:1919px) {

	#slider .slider-box {
		top: 35%;
	}

	#slider .slider-box h1 {
		margin-top: 0;
		padding-top: 0;
	}
}

/* ========================================================= ≥ 1920px — very large screens ========================================================= */
@media (min-width:1920px) {

	#slider .slider-box {
		top: 35%;
	}

	#slider .slider-box h1 {
		margin-top: 0;
		margin-bottom: 20px;
		padding-top: 0;
	}

	#slider .service-box {
		transform: translateY(-25%);
	}

	#about-us .container {
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#courses .owl-carousel .course-content {
		width: 250px !important;
		height: 350px !important;
		margin: 0 15px !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: space-between !important;
		align-items: center !important;
		text-align: center !important;
	}

	#courses .owl-carousel .course-image img {
		max-width: 100% !important;
		height: auto !important;
		object-fit: cover !important;
		max-height: 200px !important;
	}

	#courses .owl-carousel .content_style {
		flex-grow: 1 !important;
		padding: 10px !important;
	}

	#courses .owl-carousel .course_text p {
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		display: -webkit-box !important;
		-webkit-line-clamp: 3 !important;
		-webkit-box-orient: vertical !important;
		margin: 0 !important;
	}

	#courses .owl-carousel {
		padding: 0 20px !important;
	}
}

/* ========================================================= Utility / global ≥992px (layout helpers;) ========================================================= */
@media (min-width:992px) {

	#header .main-header-box .row,
	#masthead .container .row {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
	}

	#header .main-header-box .row>[class*="col-"] {
		flex: 1 1 0 !important;
		max-width: none !important;
	}

	#header .right_menu {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}

	#header .right_menu>*+* {
		margin-left: 36px;
	}

	#header .socialbox {
		margin-left: 80px;
		padding: 0;
		display: flex;
		align-items: center;
	}

	#header .socialbox a {
		width: 34px;
		height: 34px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin-left: 10px;
	}
}

/* --- Topbar fixes under 1200px: show full phone & nudge left --- */
@media (max-width:1199.98px) {

	#topbar .topbar_section .container .row {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	#topbar .topbar-phone span,
	#topbar .topbar-phone a,
	#topbar .topbar-phone .text-truncate {
		white-space: nowrap !important;
		overflow: visible !important;
		text-overflow: clip !important;
	}

	#topbar .topbar-phone {
		padding-right: 24px;
	}

	#topbar .topbar-phone i {
		margin-right: 0;
	}
}

/* ========================================================= 768–1024px — menu: hide submenus until hover (prevents stray links) ========================================================= */
@media (min-width:768px) and (max-width:1024px) {

	.main-navigation ul ul,
	.menubar .nav ul ul {
		display: none !important;
		position: absolute !important;
		top: 100% !important;
		left: 0 !important;
		min-width: 215px;
		background: #F6F6F6;
		z-index: 9999;
		box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
		margin: 0;
		padding: 0;
	}

	.main-navigation ul ul ul,
	.menubar .nav ul ul ul {
		top: 0 !important;
		left: 100% !important;
	}

	.main-navigation li:hover>ul,
	.main-navigation li:focus-within>ul,
	.menubar .nav li:hover>ul,
	.menubar .nav li:focus-within>ul {
		display: block !important;
	}

	.main-navigation ul ul,
	.menubar .nav ul ul {
		width: auto !important;
	}
}

/* ===== Large screens: prevent Latest News from overlapping the slider ===== */
@media (min-width:1511px) {

	#latest_news {
		margin-top: 0 !important;
	}

	#slider {
		padding-bottom: 60px !important;
	}
}

/* ===== Mid screens: prevent Latest News from overlapping the slider ===== */
@media (min-width:689px) and (max-width: 1199px) {

	#latest_news {
		margin-top: 0 !important;
	}

	#slider {
		padding-bottom: 360px !important;
	}
}

/* ========================================================= ABOUT US ========================================================= */
/* ABOUT US: stop image bleed on tablets & phones */
@media (max-width: 991.98px) {

	#about-us .col-6.pr-0 img.pb-3,
	#about-us .col-6.about_img img.pb-3 {
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		height: clamp(200px, 45vw, 288px) !important;
		object-fit: cover !important;
	}
}

/* When the columns stack on small screens, remove any leftover bleed */
@media (max-width: 767.98px) {

	#about-us .col-6.pr-0 img.pb-3,
	#about-us .col-6.about_img img.pb-3 {
		width: 100% !important;
		margin: 0 0 12px 0 !important;
		height: clamp(200px, 60vw, 300px) !important;
	}
}

@media (min-width: 992px) {

	#about-us .abt_media {
		position: relative;
	}

	#about-us .abt_media .row {
		margin-left: -6px;
		margin-right: -6px;
	}

	#about-us .abt_media .col-6 {
		padding-left: 6px;
		padding-right: 6px;
	}

	#about-us .abt_media img {
		width: 100% !important;
		aspect-ratio: auto !important;
		height: clamp(200px, 26vw, 240px) !important;
		object-fit: cover !important;
		display: block;
	}
}

@media (min-width: 1300px) {

	#about-us .container>.row {
		display: flex;
		align-items: flex-start;
		transform: translateX(74px);
	}

	#about-us .col-lg-6.offset-lg-2 {
		flex: 0 0 55%;
		max-width: 55%;
		margin-left: 0;
		padding-left: 140px;
		padding-right: 24px;
	}

	#about-us .abt_media {
		flex: 0 0 45%;
		max-width: 45%;
	}

	#about-us .abt_media .row {
		margin-left: -10px;
		margin-right: -10px;
	}

	#about-us .abt_media .col-6 {
		padding-left: 10px;
		padding-right: 10px;
	}

	#about-us .abt_media img {
		width: 112% !important;
		height: 270px !important;
		object-fit: cover !important;
		display: block !important;
	}

	#about-us .col-6.pr-0 img.pb-3 {
		margin-right: -8px;
	}

	#about-us .col-6.about_img img.pb-3 {
		margin-left: -8px;
	}
}

/* Expand image column to the RIGHT + lock image height */
@media (min-width: 1450px) {

	#about-us .col-lg-6.offset-lg-2 {
		flex: 0 0 52%;
		max-width: 52%;
		padding-left: 140px;
		padding-right: 0px;
		transform: translateX(32px);
	}

	#about-us .abt_media {
		flex: 0 0 48%;
		max-width: 48%;
		padding-left: 24px;
		transform: translateX(38px);
	}

	#about-us .abt_media .row {
		margin-left: 0;
		margin-right: -18px;
	}

	#about-us .abt_media .col-6 {
		padding-left: 12px;
		padding-right: 18px;
	}

	#about-us .abt_media img {
		width: 100% !important;
		height: 286px !important;
		object-fit: cover !important;
		display: block !important;
	}
}

/* ========================================================= HOW-IT-WORK ========================================================= */
/* (moved here) HOW-IT-WORK: prevent overflow & reset diamond positioning */
@media (max-width: 991.98px) {

	#how-it-work .owl-carousel .owl-stage-outer {
		overflow: hidden !important;
	}

	#how-it-work .owl-carousel .owl-item {
		transform: none !important;
	}
}

/* HOW-IT-WORK: tame diamond offsets on mid desktops (992–1350) */
@media (min-width: 992px) and (max-width: 1350px) {

	#how-it-work .owl-carousel .owl-stage-outer {
		overflow: hidden !important;
	}

	#how-it-work .owl-carousel .owl-item {
		transform: none !important;
	}

	#how-it-work .owl-carousel .owl-item:nth-of-type(1) {
		transform: translateX(-40px) !important;
	}

	#how-it-work .owl-carousel .owl-item:nth-of-type(2) {
		transform: translateX(80px) !important;
	}

	#how-it-work .owl-carousel .owl-item:nth-of-type(3) {
		transform: translateX(160px) !important;
	}
}

/* =======================================================================
   SLIDER TEXT ONLY — non-overlapping ranges
   Affects ONLY: #slider .slider-box h1 / h3 / p (+ mission summary)
   ======================================================================= */

/* 768–991.98 — center the text more */
@media (min-width: 768px) and (max-width: 991.98px) {

	#slider .slider-box {
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
		top: 52% !important;
		width: min(1100px, 92vw) !important;
		max-width: 92vw !important;
		margin: 0 !important;
		text-align: center !important;
	}

	#slider .slider-box h1 {
		font-size: clamp(30px, 4.2vw, 42px) !important;
		line-height: 1.10 !important;
		margin: 0 auto 10px !important;
		padding: 0 !important;
	}

	#slider .slider-box h3,
	#slider .slider-box .mission-toggle > summary {
		font-size: clamp(18px, 2.2vw, 24px) !important;
		line-height: 1.20 !important;
		margin: 0 auto 10px !important;
		padding: 0 !important;
	}

	#slider .slider-box p {
		font-size: clamp(13px, 1.8vw, 16px) !important;
		line-height: 1.45 !important;
		margin: 0 auto !important;
		padding: 0 !important;
		max-width: 55ch !important;
	}
}

@media (min-width: 576px) and (max-width: 767.98px) {

	#slider .slider-box {
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
		top: 50% !important;
		width: 92vw !important;
		max-width: 92vw !important;
		margin: 0 !important;
		text-align: center !important;
	}

	#slider .slider-box h1 {
		font-size: clamp(24px, 5.6vw, 34px) !important;
		line-height: 1.12 !important;
		margin: 0 auto 8px !important;
		padding: 0 !important;
	}

	#slider .slider-box h3,
	#slider .slider-box .mission-toggle > summary {
		font-size: clamp(16px, 3.2vw, 20px) !important;
		line-height: 1.20 !important;
		margin: 0 auto 8px !important;
		padding: 0 !important;
	}

	#slider .slider-box p {
		font-size: clamp(12px, 2.8vw, 14px) !important;
		line-height: 1.45 !important;
		margin: 0 auto !important;
		padding: 0 !important;
		max-width: 46ch !important;
	}
}

@media (max-width: 575.98px) {

	#slider .slider-box {
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
		top: 54% !important;
		width: 92vw !important;
		max-width: 92vw !important;
		margin-top: 0 !important;
		text-align: center !important;
	}

	#slider .slider-box h1 {
		font-size: clamp(22px, 6.6vw, 30px) !important;
		line-height: 1.12 !important;
		margin: 0 auto 8px !important;
		padding: 0 !important;
	}

	#slider .slider-box h3,
	#slider .slider-box .mission-toggle > summary {
		font-size: clamp(15px, 4.2vw, 18px) !important;
		line-height: 1.18 !important;
		margin: 0 auto 8px !important;
		padding: 0 !important;
	}

	#slider .slider-box p {
		font-size: clamp(12px, 3.6vw, 14px) !important;
		line-height: 1.45 !important;
		margin: 0 auto !important;
		padding: 0 !important;
		max-width: 42ch !important;
	}
}

/* ≤410 — very small phones */
@media (max-width: 410px) {

	#slider .slider-box {
		top: 44% !important;
	}

	#slider .slider-box h1 {
		font-size: 22px !important;
		line-height: 1.10 !important;
	}

	#slider .slider-box h3,
	#slider .slider-box .mission-toggle > summary {
		font-size: 14px !important;
		line-height: 1.15 !important;
	}

	#slider .slider-box p {
		font-size: 12px !important;
		line-height: 1.40 !important;
	}
}
/* =========================================================
   SLIDER TEXT (≤ 991.98px) — restore formatting
   ========================================================= */

/* 768–991.98 */
@media (min-width: 768px) and (max-width: 991.98px) {

  #slider .slider-box {
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    top: 52% !important;
    width: min(1100px, 92vw) !important;
    max-width: 92vw !important;
    margin: 0 !important;
    text-align: center !important;
  }

  #slider .slider-box h1 {
    font-size: clamp(30px, 4.2vw, 42px) !important;
    line-height: 1.10 !important;
    margin: 0 auto 10px !important;
    padding: 0 !important;
  }

  #slider .slider-box h2,
  #slider .slider-box h3,
  #slider .slider-box .mission-toggle > summary {
    font-size: clamp(18px, 2.2vw, 24px) !important;
    line-height: 1.20 !important;
    margin: 0 auto 10px !important;
    padding: 0 !important;
    -webkit-text-stroke: 0px;
  }

  #slider .slider-box p {
    font-size: clamp(13px, 1.8vw, 16px) !important;
    line-height: 1.45 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    max-width: 55ch !important;
  }
}

/* 576–767.98 */
@media (min-width: 576px) and (max-width: 767.98px) {

  #slider .slider-box {
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    top: 50% !important;
    width: 92vw !important;
    max-width: 92vw !important;
    margin: 0 !important;
    text-align: center !important;
  }

  #slider .slider-box h1 {
    font-size: clamp(24px, 5.6vw, 34px) !important;
    line-height: 1.12 !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
  }

  #slider .slider-box h2,
  #slider .slider-box h3,
  #slider .slider-box .mission-toggle > summary {
    font-size: clamp(16px, 3.2vw, 20px) !important;
    line-height: 1.20 !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
	-webkit-text-stroke: 0px;
  }

  #slider .slider-box p {
    font-size: clamp(12px, 2.8vw, 14px) !important;
    line-height: 1.45 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    max-width: 46ch !important;
  }
}

/* ≤575.98 */
@media (max-width: 575.98px) {

  #slider .slider-box {
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    top: 54% !important;
    width: 92vw !important;
    max-width: 92vw !important;
    margin-top: 0 !important;
    text-align: center !important;
  }

  #slider .slider-box h1 {
    font-size: clamp(22px, 6.6vw, 30px) !important;
    line-height: 1.12 !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
  }

  #slider .slider-box h2,
  #slider .slider-box h3,
  #slider .slider-box .mission-toggle > summary {
    font-size: clamp(15px, 4.2vw, 18px) !important;
    line-height: 1.18 !important;
    margin: 0 auto 8px !important;
    padding: 0 !important;
    -webkit-text-stroke: 0px;
  }

  #slider .slider-box p {
    font-size: clamp(12px, 3.6vw, 14px) !important;
    line-height: 1.45 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    max-width: 42ch !important;
  }
}

/* ≤410 */
@media (max-width: 410px) {

  #slider .slider-box {
    top: 44% !important;
  }

  #slider .slider-box h1 {
    font-size: 22px !important;
    line-height: 1.10 !important;
  }

  #slider .slider-box h2,
  #slider .slider-box h3,
  #slider .slider-box .mission-toggle > summary {
    font-size: 14px !important;
    line-height: 1.15 !important;
    -webkit-text-stroke: 0px;
  }

  #slider .slider-box p {
    font-size: 12px !important;
    line-height: 1.40 !important;
  }
}


/* =========================================================
   SLIDE 6 ONLY — Mission statement toggle (center + full width)
   ========================================================= */

/* Base: lock slide 6 caption block to true center */
#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box {
	position: absolute !important;
	top: 35% !important;
	left: 50% !important;
	right: auto !important;
	transform: translate(-50%, -50%) !important;
	width: min(1100px, 92vw) !important;
	max-width: 92vw !important;
	margin: 0 !important;
	text-align: center !important;
	z-index: 4;
}

/* Keep the toggle wrapper centered */
#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box .mission-toggle {
	width: 100% !important;
	margin: 0 auto !important;
}

/* Click-here bar: centered and full width */
#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box .mission-toggle > summary {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin: 60px auto !important;
	left: auto !important;
	right: auto !important;
	transform: none !important;
	text-align: center !important;
}

/* Mission statement content: full width */
#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box .mission-toggle > :not(summary) {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin: -24px auto 0 !important;
	left: auto !important;
	right: auto !important;
	transform: none !important;
	text-align: center !important;
}

/* Neutralize global caption offsets on slide 6 */
#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box .mission-toggle p {
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Slide 6 top-position tweaks only */
@media (max-width: 991.98px) {
	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box {
		top: 24% !important;
	}
}

@media (max-width: 767.98px) {
	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box {
		top: 22% !important;
		width: 94vw !important;
		max-width: 94vw !important;
	}
}

@media (max-width: 410px) {
	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6) .slider-box {
		top: 24% !important;
		width: 96vw !important;
		max-width: 96vw !important;
	}
}

/* Slide 6 — phones: when open, hide the bar and let the statement take its place */
@media (max-width: 767.98px) {

	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6)
	.slider-box .mission-toggle {
		position: relative !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6)
	.slider-box .mission-toggle[open] > summary {
		position: absolute !important;
		inset: 0 !important;
		opacity: 0 !important;
		z-index: 10 !important;
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		height: 100% !important;
		cursor: pointer !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item:nth-child(6)
	.slider-box .mission-toggle[open] > :not(summary) {
		margin-top: 0 !important;
	}
}

/* Slide 6: ≤591.98px — move DOWN slightly + smaller type */
@media (max-width: 591.98px) {

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .slider-box {
		top: calc(16%) !important;
		width: 94vw !important;
		max-width: 94vw !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-toggle > summary {
		font-size: clamp(12px, 2.6vw, 13px) !important;
		line-height: 1.2 !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-body,
	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-body p {
		font-size: clamp(10px, 2.3vw, 11.5px) !important;
		line-height: 1.4 !important;
	}
}

/* Slide 6: ≤410px — move DOWN slightly + smaller again */
@media (max-width: 410px) {

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .slider-box {
		top: calc(6% + 0px) !important;
		width: 96vw !important;
		max-width: 96vw !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-toggle > summary {
		font-size: clamp(11px, 3.2vw, 12px) !important;
		line-height: 1.2 !important;
	}

	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-body,
	#slider #carouselExampleIndicators .carousel-inner .carousel-item.mission-slide .mission-body p {
		font-size: clamp(9.5px, 3.0vw, 11px) !important;
		line-height: 1.4 !important;
	}
}

/* Safety: remove stray margins that can push icons down */
#header .socialbox {
	margin-top: 0 !important;
}