/* =====================================================
    Main Slider Style - Enhanced Creative Design
===================================================== */
.main-slider {
  position: relative;
  display: block;
  z-index: 10;
}

.main-slider.style1 {
    position: relative;
    display: block;
    background-color: #ffffff;
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
}

.main-slider .slide {
    position: relative;
    display: block;
    overflow: hidden;
     background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.main-slider .slide .image-layer {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    transform: scale(1);
    transition: transform 6s linear;
    z-index: 1;
    /* Add a subtle overlay */
    &::before{
      content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.2); /* Adjust the opacity as needed */
        z-index: 1;
    }
}

.main-slider .active .slide .image-layer {
     transform: scale(1.1);
}

.main-slider .content {
    position: relative;
    z-index: 11;
}

.main-slider .auto-container {
    position: relative;
}

.main-slider .active .slide .image-layer {
   transform: scale(1.1);
}

.main-slider .slide {
    position: relative;
    display: block;
    padding: 10.625rem 0;
}

.main-slider .content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
	  max-width: 38.75rem;
      /* Text glowing */
}

.main-slider .sub-title {
    position: relative;
    display: block;
    opacity: 0;
     transform: perspective(400px) rotateY(0deg) translateY(-5rem);
    transform-origin: bottom;
     transition: all 1.5s ease;
    z-index: 10;
     text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4); /* Subtle text shadow */
}

.main-slider .active .sub-title {
    opacity: 1;
      transform: perspective(400px) rotateY(0deg) translateY(0);
    transition-delay: 1.5s;
}

.main-slider .sub-title h3 {
  color: var(--thm-primary);
    font-size: 1.625rem; /* 26px */
    line-height: 2.125rem; /* 34px */
    font-weight: var(--font-bold);
     text-transform: none;
      font-family: var(--thm-font-2);
}

.main-slider .content .big-title {
    position: relative;
    display: block;
    margin-top: 1.375rem; /* 22px */
    opacity: 0;
    transform: perspective(400px) rotateY(20deg) translateY(5rem);
    transform-origin: bottom;
    transition: transform 1s ease, opacity 1s ease;
    z-index: 10;
}

.main-slider .active .content .big-title {
    opacity: 1;
    transform: perspective(400px) rotateY(0deg) translateY(0);
    transition-delay: 1s;
}

.main-slider .content .big-title h2 {
  color: var(--white-color);
  font-size: 3.25rem; /* 52px */
    line-height: 1.1em;
    font-weight: var(--font-xbold);
    text-transform: none;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* Enhanced shadow */
}

.main-slider .content .big-title h2 span {
  position: relative;
  display: inline-block;
  color: var(--thm-primary);
}

.main-slider .content .big-title h2 span::before {
  content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 2px;
    background: var(--thm-primary);
}

.main-slider .content .btns-box {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    line-height: 0;
    margin-top: 2.4375rem; /* 39px */
     opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateY(5rem);
    transform-origin: bottom;
     transition: transform 1.5s ease, opacity 1.5s ease;
    z-index: 10;
}

.main-slider .active .content .btns-box {
    opacity: 1;
   transform: perspective(400px) rotateY(0deg) translateY(0px);
      transition-delay: 2.5s;
}

.main-slider .content .btns-box a {
    padding-left: 3.125rem; /* 50px */
    padding-right: 3.125rem; /* 50px */
}

/* =====================================================
    Main Slider Nav Style - Enhanced
===================================================== */
.main-slider .owl-theme .owl-nav {
  position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    line-height: 0;
    height: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    opacity: 0;
   transform: translateY(-50%) scaleX(0.9);
   max-width: 78.125rem; /* 1250px */
     width: 100%;
    margin: 0 auto;
    z-index: 3;
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.main-slider:hover .owl-theme .owl-nav {
  opacity: 1;
   transform: translateY(-50%) scaleX(1.0);
}

.main-slider .owl-theme .owl-nav .owl-prev,
.main-slider .owl-theme .owl-nav .owl-next {
  position: relative;
    display: block;
    width: 4.375rem; /* 70px */
    height: 4.375rem; /* 70px */
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    text-align: center;
    color: rgba(255, 255, 255, 0.2);
    font-size: 1.5625rem; /* 25px */
    line-height: 4.125rem; /* 66px */
    font-weight: 100;
    opacity: 1;
     margin: 0;
    padding: 0;
     transition: all 0.3s ease;
}

.main-slider .owl-theme .owl-prev span,
.main-slider .owl-theme .owl-next span {
  display: block;
}

.main-slider .owl-theme .owl-nav .owl-prev {
  transform: rotate(180deg);
}

.main-slider .owl-theme .owl-nav .owl-next {
   transform: rotate(0);
}

.main-slider .owl-theme .owl-nav .owl-prev:hover,
.main-slider .owl-theme .owl-nav .owl-next:hover {
     color: var(--white-color);
    border-color: var(--white-color);
}

/* =====================================================
    Main Slider Dot Style - Enhanced
===================================================== */
.main-slider .banner-carousel.owl-carousel .owl-dots {
  position: absolute;
    top: 0;
    right: 4.375rem; /* 70px */
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    opacity: 0;
     transform: translateX(2rem);
    transition: all 1.5s ease;
     display: none;
}

.main-slider .banner-carousel.owl-carousel .owl-dots::before {
    content: "";
    position: absolute;
    top: auto;
    left: 0.375rem; /* 6px */
    bottom: auto;
    width: 0.1875rem; /* 3px */
     height: 5.9375rem; /* 95px */
    background: #262626;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.main-slider:hover .banner-carousel.owl-carousel .owl-dots {
    opacity: 1;
    transform: translateX(0);
}

.main-slider .banner-carousel.owl-carousel button.owl-dot {
    position: relative;
    display: block;
    width: 0.9375rem; /* 15px */
    height: 0.9375rem; /* 15px */
    background: #262626;
    border-radius: 50%;
    margin: 1.25rem 0; /* 20px */
    transition: transform 0.4s ease, background-color 0.4s ease;
    z-index: 1;
}


.main-slider .banner-carousel.owl-carousel button.owl-dot.active {
       background: linear-gradient(0deg, var(--thm-base) 0%, var(--thm-primary) 100%);
}


/* =====================================================
    Main Slider Style 2 - Enhanced
===================================================== */
.main-slider.style2 {
    position: relative;
    display: block;
    background-color: #ffffff;
      padding-left: 12.5rem; /* 200px */
}

.main-slider.style2 .slide {
  position: relative;
    display: block;
    padding-top: 12.375rem; /* 198px */
    padding-bottom: 12.8125rem; /* 205px */
}

.main-slider.style2 .slide::after {
  content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
   background: linear-gradient(90deg, rgba(30, 50, 38, 1) 0%, rgba(30, 50, 38, 1) 0%, rgba(7, 62, 156, 0.01) 44%, rgba(0, 212, 255, 0) 45%);
    z-index: 1;
}