.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: dashed 1px #fff;
  background: #d9d9d980;
  border-radius: 50px;
  width: 68px;
  height: 68px;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%) scale(1);
  color: #fff;
  cursor: pointer;
  display: flex;
  opacity: 1;
  pointer-events: auto;
  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;
}
.reason-content p {
  line-height: normal;
}
.image-reason {
  width: 440px;
  height: 400px;
  object-fit: cover;
  border-radius: 20px;
}
.image-reason.active {
  border: solid 6px #41b4b4;
  border-radius: 20px;
}
.grp-image-sec5 {
  position: relative;
  width: 500px;
  height: 500px;
  justify-content: center;
  display: flex;
}
.img-reason {
  position: absolute;
  width: 380px;
  height: 420px;
  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: dashed 1px #fff;
  background: #d9d9d980;
  border-radius: 50px;
  width: 68px;
  height: 68px;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%) scale(1);
  color: #fff;
  cursor: pointer;
  display: flex;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 10;
}

.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;
    margin: auto;
  }
  .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;
    padding-top: unset !important;
  }
  .sec3-description p {
    font-size: 14px !important;
    color: #104751 !important;
  }
  .reason-content p {
    text-align: center;
  }
  .swiper-button-next:focus,
  .swiper-button-prev:focus {
    outline: unset !important;
  }
  .show-for-large {
    display: none;
  }
  .swiper-slide {
    padding: 0 25px !important;
  }
  .swiper-slide-active::after {
    content: "";
    background-image: url(/wp-content/themes/flatsome-child/assets/images/home/banner6.svg);
    display: block;
    position: absolute;
    top: 0%;
    width: 340px;
    height: 460px;
    background-repeat: no-repeat;
    right: -5%;
    scale: 0.8;
  }
  .swiper-slide-active.hide-after::after {
    display: none !important;
  }
  .sec3-title {
    text-align: center;
    color: #318d95 !important;
    font-weight: 700 !important;
  }
  .reason-arrow {
    rotate: 45deg;
    transform: translate3d(-20px, -20px, 10px);
    animation: unset !important;
  }
  .heading-reason {
    text-align: center;
  }
  .sec3-thumbnail,
  .sec3-title,
  .sec3-description {
    transition: unset !important;
  }
  .fade-out {
    opacity: 1;
    transform: scale(1);
  }
  .fade-in {
    opacity: 1;
    transform: scale(1);
  }
  .fade-out-thumb {
    opacity: 1;
  }

  .fade-in-thumb {
    opacity: 1;
  }
}
@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-mb {
  0% {
    rotate: 45deg;
  }
  25% {
    rotate: 25deg;
  }
  50% {
    rotate: 35deg;
  }
  75% {
    rotate: 25deg;
  }
  100% {
    rotate: 45deg;
  }
}
@keyframes shake-2 {
  0% {
    rotate: -2deg;
  }
  50% {
    rotate: 2deg;
  }
  100% {
    rotate: -2deg;
  }
}
@keyframes floatLeft {
  0% {
    left: 5%;
  }
  100% {
    left: 0%;
  }
}
