.success-tab-nav { border: none; gap: 30px; }
.success-tab-thumb { background-color: var(--kal-black); color: var(--kal-white); padding: 10px 30px; font-size: 25px; line-height: 1; font-weight: 600; letter-spacing: 0.015em; transition: all .3s ease-in; cursor: pointer; min-height: 80px; }
.success-tab-thumb span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; white-space: normal; }
.success-tab-item.swiper-slide-thumb-active .success-tab-thumb, .success-tab-thumb:hover { background-color: var(--kal-white); color: var(--kal-blue); }
.autoplay-progress { position: absolute; left: 0; bottom: 0; height: 4px; width: 100%; background: transparent; z-index: 10; }
.autoplay-progress span { display: block; height: 100%; width: 0; background: var(--kal-blue); transition: width 0.1s linear; }

.sab-left { width: 50%; padding: 40px; }
.sab-right { width: 50%; }
.sab-icon { width: 130px; height: auto; margin-bottom: 45px; }
.sab-img { }
.sab-img img { position: relative; object-fit: contain; object-position: top; }
.success-accordion-btn { font-size: 18px; line-height: 1.2; font-weight: 600; padding: 10px 50px 10px 20px; position: relative; min-height: 60px; border: 0; text-align: start; background-color: var(--kal-white); letter-spacing: 0.015em; color: var(--kal-blue); }
.success-accordion-btn:before { position: absolute; top: 50%; right: 23px; font-size: 14px; float: right !important; font-family: FontAwesome; content: "\f106"; transform: translateY(-50%); }
.success-accordion-btn.collapsed:before { content: "\f107"; }
.success-accordion-btn.collapsed { background-color: var(--kal-black); color: var(--kal-white); }
.success-accordion-item { border: none !important; border-radius: 0 !important; background: var(--kal-white); }

.bg-white .success-accordion-body{background: var(--kal-grey)!important;}
.bg-white .success-tab-item.swiper-slide-thumb-active .success-tab-thumb,.bg-white .success-tab-thumb:hover{background: var(--kal-grey);}
.bg-black .success-tab-thumb{background: var(--kal-green);}
.bg-black .success-tab-item.swiper-slide-thumb-active .success-tab-thumb,.bg-black .success-tab-thumb:hover{background: var(--kal-white);color: var(--kal-green);}

.bg-white .success-accordion-btn:not(.collapsed){background: var(--kal-grey);}
.bg-black .success-accordion-btn.collapsed{background: var(--kal-green);}

/* ========================================== 
! Large devices (desktops, less than 1400px)
=========================================== */
@media (max-width:1399.98px) { 
	.sab-left { padding: 30px; }
	.success-tab-thumb {font-size: 18px; height: 60px; padding: 10px 15px; }
	.sab-icon { width: 90px; height: auto; margin-bottom: 15px; }
 

}

@media (min-width:1199px) {
	.success-accordion-header { display: none; }
	.success-accordion-item .collapse { display: block !important; }
    .tab-slider { height: 100%; }
    .success-accordion-item .collapse { height: 100%; }
    .success-accordion-body { height: 100%; }
}

/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px) { 
	.success-accordion { gap: 30px; display: flex; flex-flow: column; }
	.sab-left { width: 73%; padding: 18px 22px 23px; }
	.sab-right { width: 27%; }
	.success-accordion-body { position: relative; }

	.accordion-mob-progress { position: absolute; left: 0; bottom: 0; height: 4px; width: 100%; background: transparent; z-index: 10; }
	.accordion-mob-progress span { display: block; height: 100%; width: 0; background: var(--kal-blue); transition: width 0.1s linear; }
	.sab-text h3{display: none;}
}

/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px) { 
	.sab-left { width: 70%; padding: 0 28px 28px 20px; }
	.sab-right { width: 30%; }
}

/* =================================================  
! Small devices (landscape phones, less than 768px)
================================================= */
@media (max-width:767.98px) { 
	.success-accordion-body { position: initial; }
	.sab-left { width: 100%; padding: 10px 28px 28px 20px; position: relative; }
	.sab-right { width: 100%; }
	.sab-img { padding-bottom: 0; }
	.sab-img img{position: relative; inset: 0;}
}

/* ======================================================
! Extra small devices (portrait phones, less than 576px)
====================================================== */
@media (max-width:575.98px) { }

/* ======================================================
! Extra small devices (portrait phones, less than 370px)
====================================================== */
@media (max-width:369.98px) { }