/* =====================================================================
   MERGED STYLESHEET
   Sections:
     1. SHARED CSS (COE + Home)
     2. PAGE-SCOPED CSS (.page-coe / .page-home)
     3. CENTRES OF EXCELLENCE — page-specific
     4. HOME PAGE — page-specific
     5. AGENTS / MAP / SEARCH page (from second file)
   Notes:
   - Duplicated blocks removed (:root, .flex-center, .heading-left,
     .pkgslider__controls, empty media stubs).
   - .car-controls and label#agreement had conflicting unscoped values
     on the two pages — now scoped under .page-coe / .page-home.
   - PHP base_url() image paths converted to relative ../images/ paths.
===================================================================== */

/* ============ ROOT VARIABLES (was declared twice — merged) ============ */
:root{
	--offer-red:#E8252D;
	--offer-red-dark:#C81720;
	--offer-gold:#B5985A;
	--offer-ink:#222222;
	--offer-muted:#8a8a8a;
	--offer-track:#ece9e3;
}

/* =====================================================================
   1. SHARED CSS — used by both Centres of Excellence and Home
===================================================================== */

h2{
	color: #242422;
	font-family: 'OpenSans-Bold', sans serif;
}

.bold{
	font-family: 'OpenSans-Bold', sans serif;
}

.italic{
	font-style:italic ;
}

.heading-link-right{
	width: 110px;
}



.flex-center{
	display: flex;
	align-items: center;
}

.pkgslider__track .oc-item{
	flex: 0 0 calc((100% - 90px) / 4);  /* 4 items, 3 gaps × 30px */
	position: relative;
}

.pkgslider__track{
	display: flex;
	gap: 30px;              /* replaces owl margin:30 */
	transition: transform .55s cubic-bezier(.4,.02,.2,1);
	will-change: transform;
}

.pkgslider__viewport{
	overflow: hidden;
	padding: 15px;          /* room for card box-shadow */
	position: relative;
}

.pkgslider__controls{ margin-top: 20px; }

input[type="checkbox"] {
	accent-color: #11bf0c;
	position: relative;
}

/* =====================================================================
   2. PAGE-SCOPED CSS
   These selectors had DIFFERENT values on each page. Wrap each page's
   root content in a matching class:

     <div class="page-coe"> ... COE page content ... </div>
     <div class="page-home"> ... Home page content ... </div>
===================================================================== */

/* --- Centres of Excellence page --- */
.page-coe .nav-btn {
	width:54px;
	height:54px;
	border-radius:50%;
	display:grid; place-items:center;
	cursor:pointer;
	border:1.5px solid #e3e0d9;
	background:#fff;
	color:#9a9a9a;
	transition:all .2s ease;
}
.page-coe .nav-btn:hover { border-color:var(--offer-gold); color:#fff; background:var(--offer-gold); }
.page-coe .nav-btn:disabled { opacity:.4; cursor:not-allowed; }
.page-coe .nav-btn svg { width:22px; height:22px; }
.page-coe .car-progress { position:relative; flex:1 1 auto; height:3px; border-radius:999px; background:var(--offer-track); overflow:hidden; }
.page-coe .car-progress-fill { position:absolute; inset:0 auto 0 0; height:100%; border-radius:999px; background:var(--offer-gold); transition:width .5s cubic-bezier(.4,.02,.2,1); }
.page-coe .car-arrows { display:flex; gap:14px; }
.page-coe .car-controls{ display:flex; align-items:center; gap:30px; }
.page-coe h2 {
	color: var(--Title-Color, #242422);
	font-size: 30px;
	font-family: 'OpenSans-Bold', sans serif;
}
.page-coe label {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0px;
	color: #555;
	margin-bottom: 10px;
	cursor: pointer;
}
.page-coe label#agreement, .page-about label#agreement, .testi-form label#agreement{
	float: left;
	width: calc(100% - 30px);
	text-transform: none;
	color: #858585;
	font-size: 12px;
    font-family: 'OpenSans-Regular';
	line-height: 1.3;
    font-weight:400;
}

/* --- Home page --- */
.page-home .nav-btn {
	width:54px;
	height:54px;
	border-radius:50%;
	display:grid; place-items:center;
	cursor:pointer;
	border:1.5px solid #e3e0d9;
	background:#fff;
	color:#9a9a9a;
	transition:all .2s ease;
}
.page-home .nav-btn:hover { background-color:var(--offer-gold); color:#fff; }
.page-home .nav-btn:disabled { opacity:.4; cursor:not-allowed; }
.page-home .nav-btn svg { width:22px; height:22px; }
.page-home .car-progress {
	position:relative;
	flex:1 1 auto;
	height:4px;
	border-radius:999px;
	background:var(--offer-track, #ece9e3);
	overflow:hidden;
}
.page-home .car-progress-fill {
	position:absolute; inset:0 auto 0 0;
	height:100%;
	border-radius:999px;
	background:var(--offer-gold, #B5985A);
	transition:width .55s cubic-bezier(.4,.02,.2,1);
}
.page-home .car-arrows { display:flex; gap:16px; }
.page-home .car-controls{ display:flex; align-items:center; gap:40px; }
.page-home label {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0px;
	color: #555;
	margin-bottom: 10px;
	cursor: pointer;
}
.page-home label#agreement,
.page-home label#agreement2,
.page-home label#agreement3 {
	float: left;
	width: calc(100% - 30px);
	text-transform: none;
	color: #858585;
	font-weight: 500;
	line-height: 1.3;
	font-size: 12px;
}

/* =====================================================================
   3. CENTRES OF EXCELLENCE — page-specific
===================================================================== */

/* ============ BANNER / BREADCRUMB ============ */
.container_absolute_coe{
	position: absolute;
	bottom: 40px;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 3;
}
.container_absolute_coe h1, .container_absolute_coe .topcrumb ul li, .container_absolute_coe .topcrumb ul li a{
	color: #fff;
}

/* ============ SHARED LAYOUT / TYPOGRAPHY ============ */
.content-wrap-100{
	position: relative;
	padding: 100px 0;
}
.w-90{
	width:90%;
	margin: 0 auto;
}
.eyebrow{
	color:#EC2029;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 1; /* 200% */
	text-transform: uppercase;
	margin-bottom: 10px;
}

.about-cc__body p:last-child{
	margin-bottom: 0px;
}
.button-center{
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
}

/* ============ ABOUT IMAGE SLIDER (ccslider) ============ */
.about-cc{
	overflow: hidden;
}
.ccslider__viewport{ overflow:visible; }
.ccslider__track{ display:flex; gap:22px; transition:transform .55s cubic-bezier(.4,.02,.2,1); will-change:transform; }
.ccslider__item{ flex:0 0 calc(100%/2); border-radius:14px; overflow:hidden; }
.ccslider__item img{ width:100%; height:360px; object-fit:cover; display:block; }

/* ============ CONDITIONS & TREATMENTS ============ */
.cond{ background:#f4f2ee; padding:100px 0; }
.cond__tabs{ display:flex; justify-content:center; gap:10px; margin:38px 0 28px; }
.cond__tab{
	display:inline-flex; align-items:center; gap:10px; padding:13px 30px; border-radius:8px;
	background:#fff; color:var(--muted); font-weight:500; font-size:15px; border:1px solid #e7e4dd;
	cursor:pointer; transition:all .2s ease;
}
.cond__tab:hover{
	background: #AC8E60;
	color: #fff;
}
.cond__tab svg{
	width:30px;
	height:30px;
	border: 1px solid #AC8E60;
	border-radius: 50%;
	padding: 5px;
	color:#AC8E60;
	transition: all .5s ease-in-out;
}
.cond__tab.is-active svg, .cond__tab:hover svg{
	border: 1px solid #fff;
	color:#fff;
}
.cond__tab.is-active{ background:#AC8E60; color:#fff; border-color:#AC8E60; }
.cond__panel{ background:#fff; border-radius:14px; padding:14px 14px 30px; box-shadow:0 24px 50px -34px rgba(0,0,0,.3); }
.coe-tab-icon{
	border:1px solid #AC8E60;
}

.acc-item{ border-bottom:1px solid #e7e4dd; }
.acc-item:last-child{ border-bottom:0; }
.acc-head{
	display:flex; align-items:center; justify-content:space-between; gap:20px;
	padding:22px 18px; cursor:pointer;
}
.acc-head__title{
	font-weight: 600;
	font-size: 16px;
	font-family: 'OpenSans-SemiBold';
	margin: 0;
}
.acc-item.is-open > .acc-head .acc-head__title{ color:var(--red); }
.acc-toggle{
	flex:0 0 auto; width:30px; height:30px; border-radius:50%; background:var(--red); color:#fff;
	display:grid; place-items:center; border:0; transition:background .2s ease;
}
.acc-toggle:hover{ background:#AF1A1D; }
.acc-toggle svg{ width:14px; height:14px; }
.acc-item.is-open .acc-toggle .ico-plus{ display:none; }
.acc-item:not(.is-open) .acc-toggle .ico-minus{ display:none; }

.acc-body{
	display:grid;
	grid-template-rows:0fr;
	overflow:hidden;
	transition:grid-template-rows .35s ease, padding .35s ease;
	padding:0 18px;
}
.acc-body > *{
	overflow:hidden; /* needed so content doesn't peek out during 0fr state */
	min-height:0;
}
.acc-item.is-open .acc-body{
	grid-template-rows:1fr;
	padding:0 18px 40px;
}
.acc-body__grid{
	display:flex;
	gap:34px;
	align-items:flex-start;
	margin-bottom:0;
}
.acc-body__grid img{ flex:0 0 300px; width:300px; height:auto; object-fit:cover; border-radius:8px; }
.acc-body__grid > div{ flex:1; min-width:0; }
.acc-body__h{ font-size:24px; margin-bottom:20px;font-family: 'OpenSans-Bold'; }
.acc-body__p + .acc-body__p{ margin-top:16px; }

.js-view-more-btn svg {
	transition: transform 0.3s ease;
	margin-left: 5px;
}
.js-view-more-btn.is-expanded svg {
	transform: rotate(180deg);
}

/* ============ SPECIALISTS (doctors slider) ============ */
.spec__viewport{ overflow:hidden; margin-top:46px; }
.spec-card-desc{
	padding: 10px;
}
.spec__track{ display:flex; gap:26px; transition:transform .55s cubic-bezier(.4,.02,.2,1); will-change:transform; }
.spec-card{ flex:0 0 calc((100% - 78px)/4); }
.spec-card-photo{
	width:100%; height:280px; object-fit:cover; object-position:top center; display:block;
	border-radius: 14px;
	background: #EFEFEF;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.08);
}
.spec-card-name{ color:#AC8E60; font-weight:600; font-size:16px;margin-bottom: 5px}
.spec-card-role{ color:#858585; font-size:14px; margin:0; }

/* ============ TESTIMONIALS ============ */
.testi__grid{ display:grid; grid-template-columns:30% 70%; align-items:stretch; }
.testi__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.testi__right{
	padding:30px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.testi__viewport{
	overflow:hidden;
	padding:30px 10px;
	position:relative; }
.testi__viewport::after{
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 300px; /* adjust fade width */
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.7) 60%, #fff 100%);
	pointer-events: none;
	z-index: 2;
}
.testi__track{ display:flex; gap:30px; transition:transform .55s cubic-bezier(.4,.02,.2,1); will-change:transform; }
.testi-card{
	flex: 0 0 calc((100% - 44px) / 3); /* 3 cards visible, 2 gaps × 22px */
	border-radius: 8px;
	background: #FFF;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08);
	padding: 20px;
	position: relative;
}
.testi-card__text{ color:#555; font-size:14px; }

.testi-descp{
	display:flex;
	align-items: center;
}
.testi-descp .testi-descp-image{
	width: 90px;
}
.testi-descp-info{
	width: calc(100% - 105px);
	margin-left: 15px;
}
.testi-descp-info .title1{
	color: #555;
	font-size: 14px;
	font-weight: 700;
	margin-bottom: 0;
}
.testi-descp-info .title2{
	color: #858585;
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 5px;
}
.testi__controls{ margin-top:10px; max-width:96%; }

.testi-quote{
	position: absolute;
	top: -20px;
}

/* ============ ENQUIRY FORM ============ */
.coe-page.enquiry-form-pd{
	background-color: #fff;
	padding: 50px;
	border-radius: 0 15px 15px ;
}
.home-page.enquiry-form-pd{
	padding: 50px;
	border-radius: 14px;
	 background-origin: border-box;
    background-clip: padding-box, border-box;
    background-image: linear-gradient(#ffffff, #ffffff), linear-gradient(to bottom left, #AC8E60, #F0D8B3);
    border: 2px solid transparent;
}

.inputagree, .inputagree2, .inputagree3 {
	float: left;
	width: 15px;
	height: 15px;
	margin-right: 10px;
}
.flex-same-height{
	display: flex;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-radius: 15px;
}
.flex-center .same-height{
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.border-right{
	border-radius: 0px 15px 15px 0;
}

/* ============ CTA (WhatsApp / Telegram) ============ */
.combodia-cta-a{
	background: #24A1DE;
	border:1px solid #24A1DE;
	color:#fff;
	padding: 12px 15px;
	border-radius: 10px;
	text-decoration:none !important;
	transition:all .5s;
	display:flex;
	width: max-content;
	align-items:center;
	float:left;
	font-size: 15px;
}
.combodia-cta-a:hover{
	background:#fff;
	color:#24A1DE;
	text-decoration:none !important;
}
.combodia-cta-a i{
	font-size:25px;
}
.whatsapp-cta-a{
	background: #25D366;
	border: 1px solid #25D366;
	color: #fff;
	padding: 12px 15px;
	border-radius: 10px;
	text-decoration: none !important;
	transition: all .5s;
	display: flex;
	width: max-content;
	align-items: center;
	float:left;
	margin-right:20px;
	font-size: 15px;
}
.whatsapp-cta-a:hover{
	background:#fff;
	color:#25D366;
	text-decoration:none !important;
}
.whatsapp-cta-a i{
	font-size:25px;
}

/* ============ COE RESPONSIVE ============ */
@media (max-width: 991px){
	.ccslider__item{ flex-basis:calc((100% - 22px)/2); }
	.spec-card{ flex-basis:calc((100% - 26px)/2); }
	.testi__grid{ display:block;padding:30px 0; }
	.testi__media{ display:none; }
	.testi__right{ padding: 0 15px; }
	.testi-card{ flex-basis:calc((100% - 20px)/2); }
}
@media (max-width: 640px){
	.acc-body__grid{ flex-direction:column; }
	.acc-body__grid img{ flex:0 0 auto; width:100%; }
}
@media (max-width: 575px){
	.ccslider__item, .testi-card{ flex-basis:100%; }
	.testi__viewport::after{
	    display:none;
	}
	.testi__viewport{
	    margin-top:30px! important;
	}
}

/* =====================================================================
   4. HOME PAGE — page-specific
===================================================================== */

.modal-content {
	/* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
	width:inherit;
	max-width:inherit; /* For Bootstrap 4 - to avoid the modal window stretching full width */
	height:inherit;
	/* To center horizontally */
	margin: 0 auto;
	pointer-events: all;
}
.modal-content.announcement {
	max-width:800px;
	width:100%;
}
.modal-content.announcement h2 {
	background:#e12454;
	color:#fff;
	padding:10px;
	text-align:center;
}
.modal-content.announcement p {
	padding:0 10px;
}

.revo-slider-caps-text {
	width:400px;
	height:400px;
}

#header {
	background:none;
	background-color:transparent;
	border:none;
	position:absolute;
	margin:0 auto;
	left:0;
	right:0;
}
#header-wrap {
	background: rgba(255,255,255,0.3);
}

.owl-carousel .owl-item img {
	width:auto;
}

@media (max-width: 979px) {
	/*---Header---*/
	#header {
		background-color:#fff;
		position:static;
	}
	#header-wrap {
		background-color:#fff;
	}
}

/* ===== HERO SLIDER ===== */

/* was declared 3× with conflicting top values (50%, 50%, 20%) —
   the last one wins in the cascade, so only it is kept: */
.slider-caption.slider-caption-center {
	text-align:left;
	max-width:none;
	opacity:1 !important;
	top:20% !important;
	transform:translateY(-20%) !important;
}

/*dynamic*/
.swiper_wrapper .swiper-container .swiper-wrapper .slide-dynamic {
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0;
	background-size: cover;
	background-position: center ;
	display:flex;
	flex-direction:column;
	justify-content:center;
}

.swiper_wrapper .swiper-slide a{
	text-decoration:none! important;
}

.slider-caption:not(.dark) h2 {
	color: #444444;
	font-size:35px;
	letter-spacing: 0px;
}
#changetext2{
	font-family: 'OpenSans-Bold';
	max-width: 35%;
	float: left;
	margin-top: 4.5% ! important;
}
h2 >span.redtit, h2 > span2 >span.redtit, h3 >span.redtit{
	color:#ED2024! important;
}
.font46{
	font-size:46px;
	font-family: 'OpenSans-Bold';
	top: 10px;
	position: relative;
}

.element-img {
	float: left;
	width: 50%;
	margin-left: -10%;
}
.best-img{
	float:right;
	width:55%;
	margin-right: 14%;
}

span.nline10{
	bottom: -5px;
	position: relative;
	color: #444 ! important;
}
span2.line10{
	top:15px;
	position:relative;
}

.video-wrap video {
	display:block !important;
}

.dark .select_sepcial.sm-form-control:not(.not-dark)::-ms-expand {
	display: none;
}
.dark .select_sepcial.sm-form-control:not(.not-dark) option {
	background-color:transparent !important;
	color:#000;
}
h2#changetext3{
	font-size:40px;
	color:#ED2024;
	font-family: 'OpenSans-Bold';
	margin-bottom: 10px;
	max-width: 500px;
	margin-top: 80px ! important;
}
h3#changetext4{
	font-size:30px;
	font-family: 'OpenSans-Bold';
	color:#444;
	line-height: 1.3;
	margin-bottom:20px;
}
.jci-img{
	max-width: 350px;
}

/* ---- hero slider responsive ---- */
@media (max-width:1199px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 375px !important;
	}
}
@media (max-width:991px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 310px !important;
	}
}
@media (max-width:767px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height:205px !important;
		background-position: center bottom;
	}
}
@media (max-width:575px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 170px !important;
	}
}
@media (max-width:480px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 150px !important;
	}
}
@media (max-width:420px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 150px !important;
	}
}
@media (max-width:410px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 135px !important;
	}
}
@media (max-width:390px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide[class*="pos-slide-dynamic-"]{
		height: 120px !important;
	}
}

@media (max-width: 1550px){
	.slider-parallax-inner, .swiper_wrapper{
		height:475px! important;
	}
}
@media (max-width: 1500px){
	.slider-parallax-inner, .swiper_wrapper{
		height:465px! important;
	}
}
@media (max-width: 1400px){
	.slider-parallax-inner, .swiper_wrapper{
		height:435px! important;
	}
	.element-img {
		margin-left: -5%;
	}
}
@media (max-width: 1366px){
	.slider-parallax-inner, .swiper_wrapper{
		height:425px! important;
	}
	.best-img {
		width: 45%;
		margin-right: 25%;
	}
	#changetext2 {
		margin-top: 3.5% ! important;
	}
}
@media (max-width: 1240px){
	.slider-parallax-inner, .swiper_wrapper{
		height:387px! important;
	}
	.element-img {
		max-width:450px;
		margin-left: 0%;
	}
	h2#changetext3{
		margin-top: 55px ! important;
	}
	h3#changetext4 {
		margin-bottom:15px;
	}
}
@media (max-width: 1199px){
	.slider-parallax-inner, .swiper_wrapper{
		height:375px! important;
	}
	h2#changetext3{
		font-size:35px;
		margin-top: 50px ! important;
	}
	h3#changetext4 {
		font-size: 25px;
	}
	.jci-img {
		max-width: 300px;
	}
}
@media (max-width: 1100px){
	.slider-parallax-inner, .swiper_wrapper{
		height:340px! important;
	}
	.best-img {
		width: 40%;
		margin-right: 30%;
	}
	#changetext2 {
		font-size: 30px;
		margin-top: 2% ! important;
	}
}
@media (max-width: 1000px){
	.slider-parallax-inner, .swiper_wrapper{
		height:312px! important;
	}
}
@media (max-width: 991px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide, .slider-parallax-inner, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:310px! important;
	}
	.slider-caption.slider-caption-center{
		top: 10% !important;
	}
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide{
		height: 290px !important;
	}
	.element-img {
		max-width:300px;
	}
	.best-img {
		width: 45%;
		margin-right: 25%;
	}
	#changetext2 {
		font-size: 25px! important;
	}
	h2#changetext3{
		margin-top: 75px ! important;
	}
}
@media (max-width: 850px){
	.slider-parallax-inner, .swiper_wrapper, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:240px! important;
	}
	h2#changetext3{
		font-size:30px;
		margin-top: 48px ! important;
	}
	h3#changetext4 {
		font-size: 23px;
	}
}
@media (max-width: 767px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide, .slider-parallax-inner, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:180px! important;
	}
	#changetext2 {
		font-size: 20px! important;
	}
	.font46 {
		font-size: 35px;
	}
	.slider-caption.slider-caption-center {
		top: 10% !important;
	}
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide{
		height: 215px !important;
	}
	.element-img {
		max-width:245px;
	}
	h2#changetext3{
		font-size:25px! important;
		margin-bottom:5px! important;
	}
	.jci-img {
		max-width: 225px;
	}
	h3#changetext4 {
		font-size: 18px;
		margin-bottom:10px;
	}
	img.mobile_image {
		max-height:100px;
	}
	.package-img, .package-desc{
		display:block! important;
		width:100%! important;
		float:none! important;
		position:relative;
	}
	.package-img img{
		max-height:none! important;
		width:90%! important;
	}
	.package-desc .package-flex{
		max-width:90%;
		margin:0 auto;
		min-height:150px;
	}
	.packing-box{
		display:block! important;
		position:relative;
	}
	.slider-caption.slider-caption-center {
		margin-top:0px;
	}
}
@media (max-width: 650px){
	.slider-parallax-inner, .swiper_wrapper, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:205px! important;
	}
	.slider-caption.slider-caption-center {
		top: 10% !important;
	}
	.best-img {
		width: 50%;
		margin-right: 10%;
	}
	h2#changetext3{
		margin-top: 40px ! important;
	}
}
@media (max-width: 575px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide, .slider-parallax-inner, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:165px! important;
	}
	#changetext2 {
		font-size: 16px;
	}
	.font46 {
		font-size: 25px;
	}
	.jci-img {
		max-width: 225px;
	}
	h2#changetext3{
		margin-top: 35px ! important;
	}
}
@media (max-width: 479px){
	.slider-parallax-inner, .swiper_wrapper, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:150px! important;
	}
	.best-img {
		width: 45%;
		max-width: 45%! important;
		margin-right: 20%;
	}
	.slider-caption.slider-caption-center {
		top: 12% !important;
	}
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide{
		height: 175px !important;
	}
	.element-img {
		max-width:185px! important;
	}
	#changetext2 {
		font-size: 14px! important;
		margin-top: 3% ! important;
	}
	.font46 {
		font-size: 16px;
		text-shadow: none;
		top: 3px;
	}
	span2.line10 {
		top: 5px;
	}
	span.nline10 {
		bottom: 0px;
	}
	.slider-caption:not(.dark) img {
		max-width: 150px;
	}
	h2#changetext3 {
		font-size: 18px! important;
		margin-top: 22px ! important;
	}
	h3#changetext4 {
		font-size: 13px;
	}
}
@media (max-width: 410px){
	.swiper_wrapper:not(.full-screen):not(.canvas-slider-grid) .swiper-slide, .slider-parallax-inner, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:130px! important;
	}
	h2#changetext3 {
		font-size: 15px;
		margin-bottom:5px;
	}
	h3#changetext4 {
		font-size: 11px;
		margin-bottom:5px;
	}
	.slider-caption:not(.dark) img{
		max-width: 130px;
	}
}
@media (max-width: 390px){
	.slider-parallax-inner, .swiper_wrapper, .swiper_wrapper:not(.full-screen):not(.canvas-slider-grid){
		height:121px! important;
	}
	.slider-caption.slider-caption-center {
		top: 12% !important;
	}
}
@media (max-width: 376px){
	h2#changetext3 {
		font-size: 16px;
		margin-top: 15px ! important;
	}
	h3#changetext4 {
		font-size: 13px;
	}
	.slider-caption:not(.dark) img {
		max-width: 150px;
	}
}
@media (max-width: 350px){
	h2#changetext3 {
		font-size: 14px! important;
	}
	h3#changetext4 {
		font-size: 11px! important;
	}
	.slider-caption:not(.dark) img {
		max-width: 110px;
	}
}

/* ---- utilities ---- */
.display_none {
	display:none;
}
.display_block {
	display:block;
}
.justify-center{
	justify-content: center;
}
@media (min-width:1200px){
	.dis-1200-show{
		display: none;
	}
	.dis-1200-hide-flex{
		display: flex;
	}
}
@media (max-width:1199px){
	.dis-1200-show{
		display: block;
	}
	.dis-1200-hide-flex{
		display: none;
	}
}

.col-lg-45 {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 37.5%;
	flex: 0 0 37.5%;
	max-width: 37.5%;
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
}

/* ---- care boxes ---- */
.care-box{
	margin-bottom: 20px;
}
.care-box .care-box-link{
	display: flex;
	align-items: center;
	z-index: 9;
	position: relative;
	box-shadow: rgb(99 99 99 / 10%) 0px 2px 4px 0px;
	padding: 20px;
	border-radius: 15px;
	transition: all .5s ease-in-out;
}
.care-box:hover .care-box-link {
	box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
	transition: all .5s ease-in-out;
	background-color: #fff;
}
.care-box-link p{
	color:#858585;
	font-size: 14px;
}
.care-icon {
	width: 70px;
	float: left;
}
.care-circle-icon {
	width: 70px;
	height: 70px;
	background-color: transparent;
	border: 1px solid #cecece;
	border-radius: 50%;
	padding: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: rgba(0, 0, 0, 0.15) 2px 2px 4px;
	transition: all .5s ease-in-out;
}
.care-circle-icon path{
	fill:#AC8C5E;
	transition: all .5s ease-in-out;
}
.care-box:hover .care-circle-icon path{
	fill:#fff;
}
.care-box:hover .care-circle-icon{
	background-color: #AC8C5E;
}
.care-desc {
	width: calc(100% - 120px);
	float: left;
	padding: 0 15px;
}
.circle-right {
	width: 40px;
	height: 40px;
	background: #EC2029;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .5s;
	color: #fff! important;
	text-decoration: none! important;
}
.circle-right:hover{
	background-color: #AF1A1D;
	text-decoration: none !important;
}
.circle-right:hover i:before{
	text-decoration: none! important;
}

@media (max-width:1199px){
    .care-circle-icon {
        width: 50px;
        height: 50px;
        padding:10px;
    }
    .care-icon {
        width: 50px;
    }
    .care-desc {
        width: calc(100% - 80px);
    }
    .circle-right {
        width: 30px;
        height: 30px;
    }
}

.care-desc h4{
	font-size: 16px;
	line-height:1.2;
	font-weight: 600;
	color: #242422;
	font-family: 'OpenSans-Bold';
}

.container-full{
	padding-left: 50px;
	padding-right: 50px;
	width: 100%;
}

@media (max-width:1200px){
    .container-full{
    	padding-left: 15px;
    	padding-right: 15px;
    }
}

.icon-box-icon{
	width: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.icon-box-icon svg{
	max-width: 55px;
	max-height: 55px;
}
.icon-box-desc{
	width: calc(100% - 70px);
}
.icon-box-desc h4{
	font-size: 16px;
	transition: all .5s ease-in-out;
}
.content-wrap-50{
	position: relative;
	padding: 50px 0;
}
.content-wrap-60{
	padding: 60px 0;
	position: relative;
}
.mb-0i{
	margin-bottom: 0px! important;
}

/* ---- offers carousel (center-peek) ---- */
.offers__viewport{ width:100%; overflow:hidden; }
.offers__track{
	display:flex;
	align-items:flex-start;
	gap:40px;
	transition:transform .55s cubic-bezier(.4,.02,.2,1);
	will-change:transform;
}
.offer-slide{
	flex:0 0 580px;
	width:580px;
	transition:opacity .45s ease, transform .45s ease, filter .45s ease;
	opacity:.4;
	transform:scale(.92);
	transform-origin:center;
}

@media (max-width:575px){
    .offer-slide{
        opacity:0;
    }
}

.offer-slide.is-active{ 
    opacity:1; 
}


.offer-card{
	border-radius:15px;
	overflow:hidden;
	background:#fff;
	transition: all .5s ease-in-out;
}
.offer-slide.is-active .offer-card{
    transform:scale(1.1);
    margin-bottom:10px;
}

@media (max-width:575px){
    .offer-slide.is-active .offer-card{
        transform:scale(1);
    }
}

.offer-slide:not(.is-active) .offer-card{ box-shadow:0 16px 36px -28px rgba(0,0,0,.35); }
.offer-img{
	display:block;
	width:100%;
	aspect-ratio:16/10.4;
	object-fit:cover;
	border-radius: 15px;
}
.offer-caption{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
	padding:20px 10px;
}
.offer-caption__text{
	margin:0;
	font-weight:600;
	font-size:18px;
	line-height:1.3;
	max-width:62%;
	color: #242422;
}
.offer-slide:not(.is-active) .offer-caption__text{ font-weight:500; color:#555; }

.offers__controls{
	display:flex;
	align-items:center;
	gap:40px;
	max-width:1000px;
	margin:30px auto 0;
	padding:0 20px;
}
.offers__progress{
	position:relative;
	flex:1 1 auto;
	height:4px;
	border-radius:999px;
	background:var(--offer-track);
	overflow:hidden;
}
.offers__progress-fill{
	position:absolute; inset:0 auto 0 0;
	height:100%;
	border-radius:999px;
	background:var(--offer-gold);
	transition:width .55s cubic-bezier(.4,.02,.2,1);
}
.offers__arrows{ display:flex; gap:16px; }

.nav-btn.is-primary{
	background:var(--offer-gold);
	border-color:var(--offer-gold);
	color:#fff;
}
.nav-btn.is-primary:hover{ background:#a3874c; border-color:#a3874c; color:#fff; }

@media (max-width: 991px){
	.offer-slide{ flex-basis:78vw; width:78vw; }
}
@media (max-width: 575px){
	.offer-slide{ flex-basis:86vw; width:86vw; gap:20px; }
	.offer-slide.is-active, .offer-slide{
	   transform: scale(1);
	}
	.offers__track{ gap:20px;}
	.offer-caption{ flex-direction:column; align-items:flex-start; gap:14px;padding:10px 0; }
	.offer-caption__text{ max-width:100%; }
	.offers__controls{ gap:20px; }
}   

/* ---- counters ---- */
.counter-div{
	margin-top: 30px;
	margin-bottom: 0px;
}
.counter-desc span{
	background: linear-gradient(180deg, #AC8E60 33.05%, #F0D8B3 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size: 42px;
	line-height: 1;
}
.circle-icon{
	display: flex;
	width: 60px;
	height: 60px;
	padding: 8px;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1/1;
	border-radius: 50%;
	border:2px solid #AC8E60;
}
.circle-icon path{
	fill: #AC8C5E;
	transition: all .5s ease-in-out;
}
.counter-desc h4{
	color: #242422;
	font-size: 12px;
	font-family: 'OpenSans-Bold';
	text-transform: uppercase;
}
.counter-w-icon{
	display: flex;
	align-items: center;
	flex-direction: row;
	margin-bottom: 20px;
}
.counter-icon{
	width: 60px;
}
.counter-desc{
	width: calc(100% - 70px);
	margin-left: 10px;
}
.primary-color{
	color: #EC2029;
}
.counter-heading{
	font-family: 'OpenSans-Bold';
}
.counter-plus{
	display: inline;
	font-size: 24px;
	top: 3px;
	position: absolute;
	margin-left: 5px;
}
.mw-550{
	max-width: 500px;
}
.grey-in-home{
	background: #F5F5F5;
}

/* ---- journey boxes ---- */
.journey-box{
	background: #fff;
	padding: 20px;
	border-radius: 8px;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.journey-icon img{
	max-width: 45px;
	height: auto;
}
.journer-top{
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}
.journer-top .journey-icon{
	width: 45px;
}
.journer-top .journey-title{
	width: calc(100% - 55px);
	margin-left: 10px;
	font-family: 'OpenSans-Bold';
	color: #242422;
	line-height: 1.1;
}
.italic-bold{
	font-style: italic;
	font-family: 'OpenSans-Bold';
}
.journer-bottom p {
	margin-bottom: 0px;
	color: #858585;
	font-size: 14px;
	line-height: 1.3;
}
p{
	font-size: 14px;
	color: #858585;
	margin-bottom: 20px;
}

.featued-blog-h4{
	font-family: 'OpenSans-Bold';
}

/* ---- enquiry form / phone input ---- */
#enquiryForm .sm-form-control{
	border-radius: 5px! important;
}
.lp-phone-wrap{
	display:flex;
	gap:8px;
	align-items:center;
}
.lp-phone-prefix{
	height:38px;
	display:flex;
	align-items:center;
	padding: 0 10px;
	border-radius:6px;
	background:#fff;
	border: 1px solid rgba(0,0,0,.08);
	color:#2b2b2b;
}
.lp-phone-input{
	flex:1;
}
.iti { width: 100%; }
.iti--separate-dial-code .iti__selected-flag {
	background-color: #fff;
	border-bottom-left-radius: 6px;
	border-top-left-radius: 6px;
	border-right: 1px solid #e7e7e7;
}

/* =====================================================================
   5. AGENTS / MAP / SEARCH PAGE
   NOTE: original file used <?php echo base_url() ?> in url() — replaced
   with relative paths assuming this file lives in /css/ beside /images/.
   Adjust the path or move these two rules into an inline <style> block
   in the view if your structure differs.
===================================================================== */

/* --- testi-form-bg --- */
.testi-form{
	background-image: url(../../images/indo/v4/form-frame.jpg); /* was: <?php echo base_url()?>images/indo/v4/form-frame.jpg */
	background-size: cover;
	min-height: 600px;
	background-color: transparent;
	background-attachment: fixed;
	background-position: 100% 0%;
	background-repeat: no-repeat;
}

/* --- combodia-cta-bg --- */
.combodia-cta-bg{
	border-radius: 14px;
	overflow: hidden;
	min-height: 250px;
	display: flex;
	align-items: stretch;
	background: url(../../images/indo/bg-assistance.jpg) center / cover no-repeat; /* was: <?php echo base_url()?>images/indo/bg-assistance.jpg */
	position: relative;
	padding:30px;
}

@media(max-width:767px){
    .combodia-cta-bg{
        padding:30px 20px;
    }
}

.gold-h1{
	background: linear-gradient(180deg, #AC8E60 0%, #F0D8B3 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
h1{
	font-size: 40px;
	line-height: 1.2;
}

/* ============ MAP ============ */
.map-scroll{ overflow-x:auto; border-radius:14px; -webkit-overflow-scrolling:touch; }
.map-wrap{
	position:relative; border-radius:14px; overflow:hidden; aspect-ratio:1380/700;
	min-width:680px; /* keeps geometry — small screens swipe the map instead of squashing it */
	background:linear-gradient(160deg, #dbe9fb, #c4dcf7);
}
.map-wrap-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.map-label{ position:absolute; color:#8ba6c9; font-size:14px; font-weight:500; transform:translate(-50%,-50%); pointer-events:none; }

.map-wrap  { overflow: visible; }            /* sticky cannot work inside overflow:hidden */


@media (max-width: 640px){
  .map-info{ top: 14px; left: 14px; margin: 14px; }
}

/* Pins */
.pin{
	position:absolute; transform:translate(-50%,-100%); cursor:pointer; text-align:center;
	z-index:2; transition:transform .18s ease;
}
.pin:hover, .pin.is-active{ z-index:5; }
.pin-flag{
	width:45px; height:45px; border-radius:50%; border:5px solid #fff; overflow:hidden;
	box-shadow:0 10px 22px -8px rgba(20,50,90,.5); background:#fff; margin:0 auto;
	position:relative; transition:transform .18s ease;
}
.pin-flag::after{
	content:""; position:absolute; left:50%; bottom:-9px; transform:translateX(-50%);
	border-left:8px solid transparent; border-right:8px solid transparent; border-top:10px solid #fff;
}
.pin-flag img{ width:100%; height:100%; object-fit:cover; }
.pin:hover .pin-flag, .pin.is-active .pin-flag{ transform:scale(1.08); }
.pin.is-active .pin-flag{ border-color:#1f6fe0; }
.pin-name{
	font-weight: 600;
	font-size: 14px;
	color: #20232a;
}
.pin-count{ font-weight:600; font-size:12px; color:#1f6fe0; white-space:nowrap; }

/* Hover info card (top-left) */
.map-info{
	position:absolute; top:30px; left:30px; z-index:6; width:230px;
	background:#fff; border-radius:14px; padding:20px 22px;     box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08);;
}
.map-info-row{ display:flex; align-items:center; gap:10px;margin-bottom:10px }

@media (max-width:767px){
    .map-info-country{
        font-size:14px! important;
    }
    .pin-name{
        display:none;
    }
    .pin-count{
        display:none;
    }
    .pin-flag {
        width: 40px;
        height: 40px;
    }
}

.map-info-flag{ width:34px; height:24px; border-radius:4px; overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.2); flex:0 0 auto; }
.map-info-flag img{ width:100%; height:100%; object-fit:cover; }
.map-info-country{
	font-weight: 600;
	font-size: 18px;
	color: #242422;
}
.map-info-count{ color:#1f6fe0; font-weight:700; font-size:16px; margin-bottom:10px  }
.map-info-hint{ color:#858585; font-size:14px; line-height:1.3; margin:0; }

/* Legend (bottom-left) */
.map-legend{
	position:absolute; left:26px; bottom:26px; z-index:6; max-width:330px;
	background:#fff; border-radius:14px; padding:18px 20px; box-shadow:0 18px 40px -22px rgba(20,50,90,.4);
}
.map-legend-row{ display:flex; gap:12px; align-items:flex-start; }
.map-legend-row + .map-legend-row{ margin-top:14px; }
.map-legend-ic{ color:#1f6fe0; flex:0 0 auto; margin-top:1px; }
.map-legend-ic svg{ width:22px; height:22px; }
.map-legend p{ margin:0; font-size:14px; color:#5a5f66; line-height:1.45; }


/* ===================================================================
   Representative Offices / Agent Locator page
   Extracted from the inline <style> blocks in the view.
   NOTE: .image_absolute is NOT included here — its background-image
   URL is built server-side from $bgpath and must stay in the PHP view.
=================================================================== */

/* --- Banner heading (mobile) ---
   Original selector was bare `h1`, which would restyle every H1 on
   every page if this file is loaded globally. Scoped it to the
   Representative-page banner wrapper — update the selector if the
   wrapper id/class differs on other language variants of this page. */
@media (max-width: 767px) {
    #bread_contact_banner h1 {
        font-size: 24px;
        line-height: 1;
        text-align: center;
    }
    .container_absolute_coe {
        top: calc(50% - 50px);
    }
}

/* --- Map viewport --- */
.map-viewport {
    position: relative;
}

.map-viewport > .map-legend {
    bottom: 34px;
}

@media (max-width: 640px) {
    .map-info {
        width: 100%;
        top: unset;
        left: 0px;
        position: relative;
        margin: 30px 0 0;
    }
    .mt-30-640 {
        margin-top: 30px;
    }
}

/* ============ SEARCH BAR ============ */
.search-card{
	background:#fff; border-radius:14px; padding:18px;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08); display:flex; gap:14px; flex-wrap:wrap;
}
.search-card-input{ position:relative; flex:1 1 460px; display:flex; }

@media (min-width:992px){
    .search-card-input input{
    	flex:1;
    	border-radius: 8px 0 0 8px;
    	border-top: 1px solid #CECECE;
    	border-bottom: 1px solid #CECECE;
    	border-left: 1px solid #CECECE;
    	border-right: 0px;
    	background: #FFF;
    	padding: 0 15px;
    	font-size: 14px;
    }
}

@media (max-width:991px){
    .search-card{
        display:block;
    }
    #searchInput{
        width: 100%;
        height: 45px;
        border: 1px solid #cecece;
        border-radius: 8px;
        padding: 0 15px;
        font-size: 14px;
        color: #858585;
        background: #fff;
        margin-bottom:20px;
    }
    .search-card-input{
        display:block;
    }
    .search-card-input .btn-search{
        margin-bottom:20px;
        display: inline-flex;
        width: 100%;
        justify-content: center;
        border-radius: 8px;
        padding: 10px 20px;
        
    }
}

.btn-search{
	background:#EC2029; color:#fff; border:0; border-radius:0 8px 8px 0;
	padding:0 30px; display:inline-flex; align-items:center; gap:10px; cursor:pointer;
}
.btn-search:hover{ background:#C81720; }
.btn-search svg{ width:17px; height:17px; }
.search-card-select{ flex:0 0 320px; }
.search-card-select select{
	width: 100%;
	height: 45px;
	border: 1px solid #cecece;
	border-radius: 8px;
	padding: 0 15px;
	font-size: 14px;
	color: #858585;
	background: #fff;
}

.result-count{ 
    text-align: right;
    color: #242422;
    font-size: 14px;
    margin: 50px 0px;
    font-weight: 600;
    font-family: 'OpenSans-Bold'; }

/* ============ AGENT CARDS ============ */
.agent-grid{
	display:flex;
	flex-wrap:wrap;
	gap:30px;
}
.agent-card{
	flex:0 0 calc((100% - (30px * 2)) / 3);
	max-width:calc((100% - (30px * 2)) / 3);
	background:#fff;
	overflow:hidden;
	border-radius: 14px;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08);
}
.agent-card-top{ display:flex;  align-items:center;padding-left:10px; }
.agent-cart-top-right{
	width: calc(100% - 150px);
	padding: 0px 10px;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}
.agent-card-name{
	font-family: 'OpenSans-Bold';
	color: #242422;
	line-height:1.3;
	letter-spacing:0px;
}
.agent-card-thumb{ width:150px; height:80px; border-radius:10px 0 10px 0; object-fit:cover; flex:0 0 auto; background:#e9e6e0; }
.agent-card-loc{ color:#858585; font-size:14px; margin-bottom:0px }
.agent-card-body{ padding: 0px 15px 10px; }
.agent-card-line{ display:flex; gap:14px; align-items:center; padding:14px 0; border-top:1px solid #f0eeea;min-height: 48px; }
.agent-card-line:first-child{
	border-top:0;
	min-height:75px }
.agent-card-ic{
	width:30px; height:30px;
}
.agent-card-ic svg{ width:30px; height:30px; }
.agent-card-txt{ font-size:13px; color:#242422; line-height:1.2; }
.agent-card-txt a{ color:#242422; text-decoration:none; }
.agent-card-txt a:hover{ color:#EC2029; }
.no-results{ display:none; text-align:center; color:#858585; padding:40px 0 20px; font-size:18px; }
@media (max-width:991px){
	.agent-card{
		flex:0 0 calc((100% - 26px) / 2);
		max-width:calc((100% - 26px) / 2);
	}
	.map-info{ width:190px; padding:16px; }
	.map-legend{ max-width:280px; }
	.pin-flag{ width:44px; height:44px; }
	.lg-mb-30{
	    margin-bottom:30px;
	}
	.lg-mb-20{
	    margin-bottom:20px;
	}
}
@media (max-width:640px){
	.agent-card{
		flex:0 0 100%;
		max-width:100%;
	}
	.map-legend{ display:none; }
	.map-info{ width:160px; top:14px; left:14px; }
	.search-card-select{ flex-basis:100%; }
	.pin-name, .pin-count{ font-size:16px; }
}

.load-more-wrap{ text-align:center; margin-top:30px; }
.load-more-btn{ border:0; cursor:pointer; }
.load-more-remaining{ opacity:.75; margin-left:6px; font-weight:400; }

#enquiryForm .form-control{
    font-size: 12px;
}

#enquiryForm label{
    text-transform: capitalize;
}

span.must-red{
    color:#f50f0f;
}

/* =====================================================================
   6. ABOUT / SMC PAGE
   NOTE: .image_absolute's background-image used a dynamic PHP variable
   ($page_image passed from the controller) and has been OMITTED here —
   a static CSS file can't evaluate per-request PHP. Keep that one
   declaration as an inline style or a small <style> block in the view,
   e.g.:
     <div class="image_absolute" style="background-image:url('<?= base_url('images/uploads/page/'.$page_image) ?>')">
   Everything else from this page is included below.
===================================================================== */

.tag{
	color: #EC2029;
	/*font-family: "Sunway Sans_beta";*/
	font-size: 12px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: 1.2px;
	text-transform: uppercase;
}

.rg-30{
	row-gap:30px;
}

.image_absolute {
	min-height: 400px;
	/* background-image: set per-page via inline style — see note above */
}

.image_absolute::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(0, 0, 0, 0.4) 0%,
		rgba(0, 0, 0, 0) 73.16%
	);
}

.bread_contact_banner {
	min-height: 380px;
}

.topcrumb ul li a, .topcrumb ul li {
	color:white;
	text-transform: capitalize;
}

.container_absolute {
	top:auto;
	transform: none;
	bottom: 40px;
}

.content-wrap-100-0{
	padding: 100px 0 0 0;
}

.content-wrap-50-100{
    padding: 50px 0 100px;
}

/* ---- section 1: SMC / numbering ---- */
.smc_img{
	border-radius: 14px;
}

.numbering-container{
	display:flex;
	gap: 30px 0px;
	flex-wrap: wrap;
	margin-top: 30px;
	/*margin-bottom: 30px;*/
}

.number-icon{
	 border-radius: 50%;
    border: 2px solid #AC8E60;
    background: #FFF;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.number-icon svg{
	color: #AC8E60;
}

.pl-40{
	padding-left:40px;
}

.pr-30{
	padding-right: 30px;
}

.pl-20{
    padding-right: 30px;
}

.border-left-red{
	border-left:3px solid #EC2029;
}

.number-box{
	display:flex;
	align-items:center;
	gap:10px;
	width: calc(50% - 20px);
}
.icon-img{
	width:60px;
}

.number-counter{
	display:flex; flex-direction:column; gap:5px;
}

.counter{
	display: flex;
	align-items: flex-start;
}

.counter span {
	leading-trim: both;
	text-edge: cap;
	/*font-family: "Sunway Sans_beta";*/
	font-size: 43px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	text-transform: capitalize;
	background: linear-gradient(180deg, #AC8E60 33.05%, #F0D8B3 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.number-counter span{
	font-size: 43px;
    line-height: 43px ! important;
    height: 43px;
}

.fac-num.counter span{
	font-size: 28px;
}

.number-plus{
	color: #EC2029;
	leading-trim: both;
	text-edge: cap;
	/*font-family: "Sunway Sans_beta"; */
	font-size: 25px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

.counter-title{
	color: #242422;
	/*font-family: "Sunway Sans_beta";*/
	font-size: 12px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 0;
	text-transform: capitalize;
}

/* ---- section 2 ---- */
h3 span{
	color:#EC2029;
}

/* ---- section 3: commitment ---- */
.half_right {
	background-image: url(../../images/indo/v4/about_commitment.jpg);
	background-size: cover;
	background-position: center;
	border-radius: 14px 0 0 0;
	position:relative;
}

.img-note1-bg{
	position:absolute;
	top:0;
	opacity: 0.8;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.55) 88.89%);
	height: 50%;
	width: 100%;
	border-radius: 14px 0 0 0;
}

.img-note1{
	position:absolute;
	top:40px;
	left:100px;
	text-align:left;
	color:#fff;
	font-style: normal;
}

.img-note1::before{
	width: 55px;
	height: 1px;
	background: #FFF;
	content: '';
	position: absolute;
	inset: 0;
	left: -70px;
	top: 10px;
}

.img-note2-bg{
	position:absolute;
	bottom:0;
	right:0;
	opacity: 0.7;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 72.13%);
	height: 50%;
	width: 100%;
}
.img-note2{
	position:absolute;
	bottom:50px;
	right:50px;
	text-align:right;
	color:#fff;
	font-style: normal;
	max-width: 500px;
}

.img-note-img{
	position:absolute;
	bottom:0;
	right:0;
	width:100%;
}

.left-box{
	margin-top:55px;
	background: #F5F5F5;
	padding: 88px 77px 87px 77px;
}

h2, .h2{
	text-transform: capitalize;
}

h2 span{
	color:#EC2029;
}

.commitment-box{
	display: flex;
	align-items: center;
	padding: 20px 0;
	gap: 15px;
	border-bottom: 1px solid #CECECE;
}

.commitment-box:last-child{
	border-bottom:none;
}

.commitment-img{
	max-width:135px;
}

/* ---- section 4: facilities ---- */
.facility-bg{
	background-image: url(../../images/indo/v4/facility-bg.png);
	background-size: cover;
	background-position: center;
}

.fac-row{
	row-gap:30px;
	justify-content:center;
}

.facility-container{
	display: flex;
	padding: 10px 20px;
	align-items: center;
	gap: 13px;
	border-radius: 14px;
	background: #FFF;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.04), 0 8px 16px 0 rgba(0, 0, 0, 0.08);
	height: 100%;
}

.fac-img{
	 width: 50px;
    height: 50px;
    padding: 10px;
    border: 1px solid #AC8E60;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
.fac-img svg{
	max-width: 30px;
	max-height: 30px;
}

.fac-num, .fac-num.counter{
	leading-trim: both;
	text-edge: cap;
	/*font-family: "Sunway Sans_beta";*/
	font-size: 28px;
	font-style: normal;
	font-weight: 700;
	margin-bottom: 3px;
	line-height: normal;
	text-transform: capitalize;
	background: linear-gradient(180deg, #AC8E60 33.05%, #F0D8B3 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.fac-title{
	color: #242422;
	/*font-family: "Sunway Sans_beta";*/
	font-size: 10px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	text-transform: uppercase;
}

/* ---- section 5: award ---- */
.pt-60.pb-60 .container{
	max-width: 1380px;
}

/* ---- section 6: international patient services ---- */
.international-patient-container{
	background-image: url(../../images/indo/v4/international-patient-service-2.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	/*aspect-ratio: 148/51;*/
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	/*height: 500px;*/
}

.IPS-box{
	display: flex;
	/*width: 576px;*/
	/*height: 542px;*/
	width: 45%;
	padding: 35px;
	margin:55px;
	flex-direction: column;
	align-items: flex-start;
	gap: 9px;
	border-radius: 14px;
	background: #FFF;
}

.btn-buy2 {
	background: #EC2029;
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 10px 20px;
	font-size: 14px;
	cursor: pointer;
	transition: background .2s;
	white-space: nowrap;
	display: inline-block;
}

.btn-buy2:hover {
	background-color: #D41D25;
	text-decoration: none !important;
	color: #fff !important;
}

.abt-about-content h5{
    margin-bottom:10px;
}

.card-badge{
    top: -8px;
    left: -24px;
}

@media (max-width:1199px){
    .hide-1199{
        display:none;
    }
    .col-6-1199{
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (min-width:1200px){
    .hide-1199{
        display:block;
    }
}

@media (max-width:991px){
    .pkgslider__track .oc-item {
        flex: 0 0 calc(100% / 3 - 30px);
        position: relative;
    }
}

@media screen and (min-width: 768px) {
    .heading-left{
    	width: calc(100% - 120px);
    }
}

/* ---- About/SMC responsive ---- */
@media screen and (max-width: 767px) {
    
    .pr-pl-15-767{
        padding-left:15px;
        padding-right:15px;
    }
    
    .pr-pl-15-767 .award-col{
        padding-left:10px;
        padding-right:10px;
    }
    
    .page-coe .car-controls {
        margin-top: 20px ! important;
    }
    
    .page-coe .nav-btn{
        width: 35px;
        height: 35px;
    }
    .page-coe .nav-btn svg {
        width: 18px;
        height: 18px;
    }
    
    .acc-body__grid img{
        width:100%;
    }
    .acc-body__grid{
        flex-direction: column;
    }
    
    .block-767{
        display:block;
    }
    
    .w-100-767{
        width:100%! important;
    }
    
    .mt-30-767{
        margin-top:30px;
    }
    
    .center-767{
        text-align:center;
    }
    
    .journer-top{
        flex-direction: column;
        text-align: center;
    }
    .journey-icon{
        margin-bottom:10px;
    }
    .journer-bottom{
        text-align:center;
    }
    
    .content-wrap-50, .content-wrap-100{
        padding:30px 0 10px;
    }
    
    .content-wrap-50-100, .cond{
        padding:30px 0;
    }
    
    .mb-30-767{
        margin-bottom:30px;
    }
    
    .page-home .nav-btn {
        width: 35px;
        height: 35px;
    }
    
    .page-home .nav-btn svg {
        width: 15px;
        height: 15px;
    }
    
    .col-6-767{
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    
    .journer-top .journey-title{
        width:100%;
        margin-left:0px;
    }
    
    .number-counter .counter-title{
        text-align:left;
    }
    
    .col-12-767{
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

	.bread_contact_banner, .image_absolute {
		min-height: 150px;
	}

	.container_absolute{
		transform: translate(-50%, -65%);
		left: 20%;
		top:60%;
		bottom:0;
	}

	

	.content-wrap-100-0{
		padding: 50px 0 0 0;
	}

	.content-wrap-0-50{
		padding: 0px 0px 50px;
	}
	
	.content-wrap-0-30{
		padding: 0px 0px 30px;
	}

	h3, .h3{
		font-size:18px;
	}

	.mb-50, .mb-60{
		margin-bottom:30px !important;
	}
	
	.mb-mb-30{
        margin-bottom:30px;
    }
    
    .mb-mt-30{
        margin-top:30px;
    }

	/* section 1 mobile */
	.sec1-p{
		margin-bottom:30px !important;
	}
	

	.facility-container {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap:10px;
	}

	.facility-box{
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
	}

	.fac-title{
		text-align: center;
	}

	/* section 3 mobile */
	.commitment-mb-top{
		background: #F5F5F5;
		padding-top: 50px;
		padding-bottom: 10px;
	}

	.commitment-mb-top .mb-aligncenter {
		text-align: center;
	}

	.commitment-mb-bt {
		background-image: url(../../images/indo/v4/about_commitment.jpg);
		background-size: cover;
		background-position: center;
		border-radius: 0;
		position:relative;
		height: 550px;
	}

	.img-note1-bg {
		left: 0;
		border-radius: 0;
	}

	.img-note1 {
		top: 40px;
		left: auto;
	}

	.img-note1::before {
		left: 0;
		top: -10px;
	}

	.img-note2 {
		bottom: 50px;
		right: 15px;
		font-size: 16px;
        padding-left: 30px;
	}

    

	/* section 4 mobile */
	.fac-num {
		font-size: 24px;
	}

	/* section 6 mobile */
	.IPS-mb-img img{
		border-radius: 14px;
	}

	.IPS-mb-box{
		margin-top:30px;
	}
	.pkgslider {
	    overflow:hidden;
	}
	.pkgslider__viewport{
	    padding:15px 0 0 15px;
	    overflow:visible;
	}
	.pkgslider__track .oc-item {
        flex: 0 0 calc(100% / 2 - 50px);
        position: relative;
    }
    .card-badge{
        top: -15px;
        left: -15px;
        padding-left:0;
    }
    .home-page.enquiry-form-pd, .coe-page.enquiry-form-pd{
        padding:20px;
        border-radius:15px;
    }
    
    .content-wrap-30-0-767{
        padding:30px 0;
    }
    
     .mb-0-767{
         margin-bottom:0px;
     }
     .pb-30-767{
         padding-bottom:30px;
     }
  
}

@media (max-width:575px){
    .mw-550{
        max-width:100%;
    }
    .xs-mb-30{
        margin-bottom:30px;
    }
    .center-575{
        text-align:center;
    }
    .pkgslider__track .oc-item {
        flex: 0 0 calc(100% / 2);
        position: relative;
    }
}

@media (max-width:479px){
    
    .card-img-wrap img{
        height:110px;
    }
    
    .journey-box{
        padding: 20px 10px;
    }
    
    .number-icon {
        width: 45px;
        height: 45px;
        padding:5px;
    }
    .number-counter span {
        font-size: 32px;
        line-height: 32px ! important;
        height: 32px;
    }
    .number-box{
        flex-direction: column;
        justify-content: center;
    }
    .number-counter {
        justify-content: center;
        text-align: center;
        padding:0 15px;
    }
    .number-counter .counter{
        justify-content: center;
    }
    .number-counter .counter-title {
        text-align: center;
    }
}