/*--------------------------------------------------------------
# Customizing Header Transparent & Nav Menu
--------------------------------------------------------------*/
#header.transparent{background: transparent; border-bottom: none;}
@keyframes header_transparent_navbar_collapsed {0% {background: #ffffff;} 100% {background: transparent;}}
#header.transparent.navbar-collapsed{animation: header_transparent_navbar_collapsed 0.26s ease-in-out 0s forwards !important;}

#header .logo-colorful{position: initial; visibility: initial; opacity: 1;}
#header .logo-transparent{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; visibility: hidden; opacity: 0;}
#header.transparent .logo-colorful{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; visibility: hidden; opacity: 0;}
#header.transparent .logo-transparent{position: initial; visibility: initial; opacity: 1;}
#header.transparent .navbar-toggler i{color: #ffffff;}
#header.transparent.navbar-show .navbar-toggler i{color: var(--primary);}
@keyframes header_transparent_navbar_show__logo_transparent {0% {opacity: 1;} 100% {opacity: 0;}}
#header.transparent.navbar-show .logo-transparent{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; visibility: hidden; animation: header_transparent_navbar_show__logo_transparent 0.05s ease-in-out 0s forwards !important;}
@keyframes header_transparent_navbar_show__logo_colorful {0% {opacity: 0;} 100% {opacity: 1;}}
#header.transparent.navbar-show .logo-colorful{position: initial; visibility: initial; animation: header_transparent_navbar_show__logo_colorful 0.05s ease-in-out 0s forwards !important;}
@keyframes header_transparent_navbar_collapsed__logo_transparent {0% {opacity: 0;} 100% {opacity: 1;}}
#header.transparent.navbar-collapsed .logo-transparent{position: initial; visibility: initial; animation: header_transparent_navbar_collapsed__logo_transparent 0.05s ease-in-out 0s forwards !important;}
@keyframes header_transparent_navbar_collapsed__logo_colorful {0% {opacity: 1;} 100% {opacity: 0;}}
#header.transparent.navbar-collapsed .logo-colorful{position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; visibility: hidden; animation: header_transparent_navbar_collapsed__logo_colorful 0.05s ease-in-out 0s forwards !important;}
@media (min-width: 992px){#header.transparent .navbar-collapse .nav-link{color: #ffffff !important;}
#header.transparent .navbar-collapse .nav-link.active, #header.transparent .navbar-collapse .nav-link.show{color: var(--secondary-lighter) !important}
#header.transparent .navbar-collapse .nav-link:hover{color: var(--secondary) !important;}
}
#header.transparent .nav-menu ul li .main-nav-item{color: #ffffff !important;}
#header.transparent .btn-group-language button{color: #ffffff !important;}
#header.transparent .btn-group-language button svg{fill: #ffffff;}


/*--------------------------------------------------------------
# slides section
--------------------------------------------------------------*/
#slides-section .swiper-container{border-radius: 0px 0px 16px 16px !important; overflow: hidden;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container{width: 100%; height: 100vh; height: 100svh; min-height: 100vh; min-height: 100svh; max-height: 100vh; max-height: 100svh; position: relative;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-image-container img{min-height: 100vh; min-height: 100svh; max-height: 100vh; max-height: 100svh; object-fit: cover; object-position: center; transform: scale(1.25); opacity: 1;}
@keyframes zoom_in {0% {transform: scale(1); opacity: 1;} 100% { transform: scale(1); opacity: 0;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide.swiper-slide-prev .slide-container .slide-image-container img, #slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide.swiper-slide-next .slide-container .slide-image-container img{animation: zoom_in 0.28s ease-in-out 0s forwards;}
@keyframes zoom_out {0% {transform: scale(1.25);} 100% { transform: scale(1); opacity: 1;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .slide-container .slide-image-container img{animation: zoom_out 1.4s ease-in-out 0.20s forwards !important;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly{width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide .slide-container .slide-overly{background: rgb(0 0 0 / 25%);}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide .slide-container .slide-overly .slide-carousel{color: #ffffff; transform: scale(0.75); opacity: 0;}
@keyframes slide_carousel_in {0% {transform: scale(1); opacity: 1;} 100% {transform: scale(0.75); opacity: 0;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide.swiper-slide-prev .slide-container .slide-overly .slide-carousel, #slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide.swiper-slide-next .slide-container .slide-overly .slide-carousel{animation: slide_carousel_in 0.14s ease-in-out 0s forwards;}
@keyframes slide_carousel_out {0% {transform: scale(0.75); opacity: 0;} 100% {transform: scale(1); opacity: 1;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.slide.swiper-slide-active .slide-container .slide-overly .slide-carousel{animation: slide_carousel_out 1s ease-in-out 0.80s forwards;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly .slide-carousel .carousel-title{line-height: 1.34; font-size: 60px; font-weight: 700;}
@media (max-width: 1024px){#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly .slide-carousel .carousel-title{font-size: 30px;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly .slide-carousel .carousel-describe{line-height: 1.4; font-size: 24px;}
@media (max-width: 1024px){#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly .slide-carousel .carousel-describe{font-size: 18px;}}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide .slide-container .slide-overly .slide-carousel .carousel-btn{padding: 9px 20px; border-radius: 24px; line-height: 1.25; font-weight: 700;}
#slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.nested-slide.bg-warning .slide-container .slide-overly .slide-carousel .carousel-btn, #slides-section .swiper-container .swiper .swiper-wrapper .swiper-slide.nested-slide.bg-light .slide-container .slide-overly .slide-carousel .carousel-btn{--bs-btn-bg: #000000; --bs-btn-border-color: #000000; --bs-btn-color: #ffffff; --bs-btn-hover-bg: #ffffff; --bs-btn-hover-border-color: #ffffff; --bs-btn-hover-color: #000000;}
#slides-section .swiper-container .swiper .swiper-navigation.swiper-main-navigation{height: 33.600px; position: absolute; right: 0px; bottom: 50%; left: 0px;}
@media (max-width: 575px){#slides-section .swiper-container .swiper .swiper-navigation.swiper-main-navigation{bottom: 50%;}}
#slides-section .swiper-container .swiper .swiper-navigation.swiper-main-navigation .swiper-btn{background: transparent !important; width: 32px !important; height: 32px !important; border-color: transparent !important; border-radius: 50%; margin-top: 0px; display: inline-flex; justify-content: center; align-items: center;  color: #ffffff !important; font-size: 1.8rem !important; line-height: 1rem !important; transition: all .5s ease !important; box-shadow: none !important;}
#slides-section .swiper-container .swiper .swiper-navigation.swiper-main-navigation .swiper-btn::after{font-size: 1.8rem !important;}
.swiper-button-prev, .swiper-rtl .swiper-button-next{left: 24px; right: auto;}
.swiper-button-next, .swiper-rtl .swiper-button-prev{right: 24px; left: auto;}
@media (max-width: 767px) {.swiper-button-prev, .swiper-rtl .swiper-button-next{left: 4px; right: auto;} .swiper-button-next, .swiper-rtl .swiper-button-prev{right: 4px; left: auto;}}
#slides-section .swiper-container .swiper .swiper-navigation.swiper-main-navigation:has(.swiper-button-next.swiper-button-disabled):has(.swiper-button-prev.swiper-button-disabled){display: none !important;}
#slides-section .swiper-container .swiper .swiper-pagination .swiper-pagination-bullet{border-color: #ffffff !important;}
#slides-section .swiper-container .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background: #ffffff !important;}


/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
#services-section .swiper-slide .swiper-slide-container{padding-top: 25px;}

#services-section .swiper-slide .swiper-slide-container .icon-container{position: absolute; top: 0px; z-index: 100;}
#services-section .swiper-slide .swiper-slide-container .icon-container .icon-content{border-radius: 8px;}
#services-section .swiper-slide .swiper-slide-container .icon-container .icon-content img{max-width: 42px; aspect-ratio: 1 / 1;}

#services-section .swiper-slide .swiper-slide-container .serv-card-container{width: 100%; aspect-ratio: 1 / 0.6; position: relative; border-radius: 20px 20px 5px 5px; overflow: hidden;}
@media (max-width: 576px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.65;}}
@media (max-width: 501px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.65;}}
@media (max-width: 491px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.75;}}
@media (max-width: 426px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.75;}}
@media (max-width: 421px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.76;}}
@media (max-width: 411px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.82;}}
@media (max-width: 401px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.95;}}
@media (max-width: 391px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.95;}}
@media (max-width: 381px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 1;}}
@media (max-width: 371px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 1;}}
@media (max-width: 359px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.72;}}
@media (max-width: 351px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.72;}}
@media (max-width: 341px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.76;}}
@media (max-width: 331px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.85;}}
@media (min-width: 576px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.42;}}
@media (min-width: 768px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.4;}}
@media (min-width: 992px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.51;}}
@media (min-width: 1200px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.46;}}
@media (min-width: 1400px){#services-section .swiper-slide .swiper-slide-container .serv-card-container{aspect-ratio: 1 / 0.35;}}




#services-section .swiper-slide .swiper-slide-container .serv-card-container .card{width: 100%; height: 100%; border: none !important; border-radius: inherit;}

#services-section .swiper-slide .swiper-slide-container .serv-card-container .card .front-content{width: 100%; height: 100%; transition: all 0.6s cubic-bezier(0.23, 1, 0.320, 1)}

#services-section .swiper-slide .swiper-slide-container .serv-card-container .card .front-content .title{line-height: 1.3; font-size: 1.5rem; font-weight: 700; background: linear-gradient(-45deg, #87383d 10%, var(--secondary) 100% ); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; transition: all 0.6s cubic-bezier(0.23, 1, 0.320, 1)}

#services-section .swiper-slide .swiper-slide-container .serv-card-container .card .heading-content{background: linear-gradient(-45deg, #87383d 0%, var(--secondary) 100% ); width: 100%; height: 100%; border-radius: 10px; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 2; gap: 10px; line-height: 1.5; color: #e8e8e8; transition: all 0.6s cubic-bezier(0.23, 1, 0.320, 1);}

#services-section .swiper-slide .swiper-slide-container .serv-card-container{opacity: 0.2;}
#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container{opacity: 1 !important;}

#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container .card::before{content: ''; background: var(--secondary); width: 14%; min-width: 14%; max-width: 14%; height: 2%; position: absolute; top: 0px; right: auto; left: 0px; z-index: 0;}
#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container .card::after{content: ''; background: var(--secondary); width: 14%; min-width: 14%; max-width: 14%; height: 2%; position: absolute; top: 0px; right: 0px; left: auto; z-index: 0;}

#services-section .swiper-slide .swiper-slide-container .serv-card-container .card .heading-content{transform: translateY(90%);}
#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container .card .heading-content{transform: translateY(97%);}
#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container .card:hover .heading-content {transform: translateY(5%);}
@keyframes swiper_slide_active_heading_content_show {0% {transform: translateY(97%);} 100% {transform: translateY(5%);}}
#services-section .swiper-slide.swiper-slide-active .swiper-slide-container .serv-card-container .card .heading-content{animation: swiper_slide_active_heading_content_show 1s ease-in-out 4.5s forwards;}

#services-section .swiper-slide .swiper-slide-container .serv-card-container .card .heading-content .title{line-height: 1.3; font-size: 1.5rem; font-weight: 700;}





/*--------------------------------------------------------------
# Brands Section
--------------------------------------------------------------*/
.brands-section .swiper .swiper-wrapper{cursor: grab;}
.brands-section .swiper .swiper-wrapper .swiper-slide .swiper-slide-container{aspect-ratio: 1 / 1 !important; position: relative;}
/* .brands-section .swiper .swiper-wrapper .swiper-slide .swiper-slide-container::after{content: ''; background: #000; opacity: 0.03; width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1;} */





/*--------------------------------------------------------------
# testimonials section
--------------------------------------------------------------*/
.testimonials .testimonial-item {box-sizing: content-box;}
  
.testimonials .testimonial-item .client-info {margin-top: -45px; position: relative; z-index: 2;}
  
.testimonials .testimonial-item .testimonial-img {width: 90px; height: 90px; border-radius: 50%; position: relative; z-index: 2; border: 6px solid var(--light);}
  
.testimonials .testimonial-item h3 {font-size: 18px; font-weight: bold; color: var(--primary-darker) !important;}
  
.testimonials .testimonial-item p {background: var(--light); padding: 20px 20px 59px 20px; position: relative; border-radius: 12px; position: relative; z-index: 1; color: var(--text) !important;}
@media (min-width: 992px){.testimonials .testimonial-item p{padding: 32px 32px 71px 32px !important;}}
.testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {display: inline-block; position: relative; color: var(--primary-lighter); font-size: 22px;}
.testimonials .testimonial-item .quote-icon-left{bottom: -4px;}
.testimonials .testimonial-item .quote-icon-right{top: 9px;}










/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/











