
/*******************************/
/******* Metode Cleaning CSS *******/
/*******************************/
.metode-cleaning {
    padding: 50px 0 30px 0;
}
.metode-cleaning .section-header h2{
	font-weight: 300;
}

.metode-cleaning .mc-item {
    position: relative;
    margin: 0 15px;
    text-align: center;
	margin-bottom: 40px;
}

.metode-cleaning .mc-img {
    position: relative;
    margin-bottom: 10px;
    z-index: 1;
}

.metode-cleaning .mc-item img {
    margin: 0 auto;
    width: 100%;
	border-radius: 40px 40px 100px 100px;  /*  border-radius: 100px; */
}

.metode-cleaning .mc-content {
    position: relative;
    margin-top: -90px;
    padding: 100px 10px 2px 10px;
    text-align: center;
    background: #FFD662;
    border-radius: 9px;
	transition: .3s;
	border: 1px solid #ccc;
}

.metode-cleaning .mc-content:hover {
    background: #ffffff;
    border: 1px solid #FFEAA7;
	
}

.metode-cleaning .mc-content h2 {
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 600;
    color: #0056b3; /* 00539C lebih gelap*/
	line-height: 1.5em;
}

.metode-cleaning .mc-content h2 span{
	display: inline;
}

.metode-cleaning .mc-item p {
    color: #000000;
    font-size: 16px;
    font-weight: 500;
	line-height: 1.8em;
}




/* MODAL - METODE CLEANINF */
.metode-cleaning .mc-content p a.modal-hotsteam{
	font-weight: 500;
	color: #0056b3;
	font-size: 16px;
}

.modal-hotsteam-item .modal-title{
	color: #0056b3;
	font-weight: 600;
	font-size: 200px;
}

.modal-hotsteam-item .modal-body{
	color: #000000;
	font-weight: 500;
	font-size: 15px;
	line-height: 1.8em;
}

.modal-hotsteam-item .modal-body span{
	color: #0056b3;
	font-weight:600;
}

.modal-hotsteam-item .modal-body div.addon {
	color: #0056b3;
	font-size: 14px;
	font-weight: 500;
	padding-top: 5px;
}



/* MODAL - OWL CAROSELL */
.metode-cleaning .owl-nav,
.metode-cleaning .owl-dots {
    margin-top: 15px;
    text-align: left;
}

.owl .owl-dot {
    display: inline-block;
    margin: 0 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #FFD662;
}

.metode-cleaning .owl-dot.active {
    background: #00539C;
}

.metode-cleaning .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
	 pointer-events: none; /* Agar area tengah tetap bisa di-klik/drag */
}

.metode-cleaning .owl-nav .owl-prev,
.metode-cleaning .owl-nav .owl-next {
	pointer-events: auto; /* Mengaktifkan kembali klik pada tombol */
    color: #007bff;
    padding: 8px 5px;
    margin: 0 -15px; /* Atur jarak keluar/masuk dari container */
    border-radius: 50%;
	font-size: 96px;
    /* Transisi halus saat di-hover */
    transition: all 0.3s ease; 
}

/* Efek Hover Secara Umum (Warna berubah sedikit lebih gelap saat didekati) */
.metode-cleaning .owl-nav .owl-prev:hover,
.metode-cleaning .owl-nav .owl-next:hover {
    color: #0056b3;
}

/* Efek Gerakan Tombol Kiri saat Hover */
.metode-cleaning .owl-nav .owl-prev:hover {
    transform: scale(1.1) translateX(-5px); /* Membesar dan geser kiri */
}

/* Efek Gerakan Tombol Kanan saat Hover */
.metode-cleaning .owl-nav .owl-next:hover {
    transform: scale(1.1) translateX(5px); /* Membesar dan geser kanan */
}


