.additional-sec3{
    max-width: 1090px;
    justify-content: flex-end;
}
.desktop .next-img,
.desktop .prev-img{
    cursor: pointer;
    position: relative;
}
.sec3-thumbnail,
.sec3-title,
.sec3-description {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.fade-out {
    opacity: 0;
    transform: scale(0.98);
}

.fade-in {
    opacity: 1;
    transform: scale(1);
}

.desktop .prev-img img,
.desktop .next-img img {
    transition: opacity 0.3s ease;
}

.fade-out-thumb {
    opacity: 0;
}

.fade-in-thumb {
    opacity: 1;
}

.desktop .next-img::after,
.desktop .prev-img::after {
    content: 'Click';
    position: absolute;
    top: 50%;
    left: 50%;
    border: solid 1px #D9D9D980;
    background: #D9D9D980;
    border-radius: 50px;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    transform: translate(-50%, -50%) scale(0.8);
    color: #fff;
    cursor: pointer;
    display: flex;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease;
    z-index: 10;
}

.desktop .next-img:hover::after,
.desktop .prev-img:hover::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}

/* Section5 */
.heading-reason{
    cursor: pointer;
}
.reason-description .relative{
    display: flex;
}
.reason-description .relative {
    display: flex;
    align-items: center;
    gap: 10px;
}
.heading-reason{
	text-align: left;
	margin: 0 !important;
}
.reason-description{
    opacity: 0;
    display: none !important;
}
.reason-description.active{
    opacity: 1;
    display: block !important;
}
.reason-arrow.shake{
    animation: shake 1.5s ease-in-out;
}
.image-reason{
    width: 440px;
    height: 400px;
	object-fit: cover;
}
.image-reason.active{
    border: solid 5px #41b4b4;
    border-radius: 10px;
}
.grp-image-sec5{
    position: relative;
    width: 500px;
    height: 500px;
}
.img-reason{
    position: absolute;
    width: 450px;
    height: 430px;
    display: flex;
    justify-content: center;
    z-index: 1;
}
.img-reason.active{
    background-image: url(/wp-content/uploads/2025/07/background-sec5.png);
    background-size: cover;
    background-position: bottom;
    z-index: 3;
}
.img-reason.active::after {
    content: 'Click';
    position: absolute;
    top: 50%;
    left: 50%;
    border: solid 1px #D9D9D980;
    background: #D9D9D980;
    border-radius: 50px;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    transform: translate(-50%, -50%) scale(0.8);
    color: #fff;
    cursor: pointer;
    display: flex;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease;
    z-index: 10;
}
.img-reason.active:hover::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}
.img-r1{
    rotate: -4deg;
}

.img-r2{
    rotate: 3deg;
}

.img-r3{
    rotate: -2deg;
}
.additional-sec5 .order-1{
    justify-items: center;
}
.additional-sec5 ul{
    max-width: 1000px;
}
.img-reason.active{
        animation: shake-2 4s ease-in-out infinite ;
    }
@media screen and (max-width:767px) {
    .image-reason{
        width: 300px;
        height: 300px;
    }
    .grp-image-sec5{
        width: 300px;
        height: 350px;
    }
    .img-reason{
        width: 300px;
        height: 320px;
    }
    .reason-description .relative {
        transform: translateX(-10%);
    }
    .additional-sec5 ul{
        padding: 0 !important;
    }
    .img-reason.active{
        animation: shake-2 1.5s ease-in-out infinite ;
    }
    .additional-sec3{
        height: 600px !important;
    }
	.sec3-description p{
		font-size: 14px !important;
	}
}
@media screen and (min-width:768px) and (max-width:1024px) {
    .additional-sec5{
        flex-direction: column-reverse !important;
    }
    .additional-sec5 ul,
    .additional-sec5 .order-1{
        width: 100% !important;
    }
    
}
@keyframes shake {
    0%{
        rotate: -20deg;
    }
    25%{
        rotate: 20deg;
    }
    50%{
        rotate: -10deg;
    }
    75%{
        rotate: 10deg;
    }
    100%{
        rotate: 0deg;
    }
}
@keyframes shake-2 {
    0%{
        rotate: -2deg;
    }
    50%{
        rotate: 2deg;
    }
    100%{
        rotate: -2deg;
    }
}
@keyframes floatLeft {
    0%{
        left: 5%;
    }
    100%{
        left: 0%;
    }
}