/* SERVICE FLEET
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.service-fleet {
   padding: 70px 0 100px;
   overflow: hidden;
   background: var(--clr-light);
}

.service-fleet-heading > div:first-child { max-width: 760px; }

.service-fleet-nav button {
   width: 42px;
   height: 42px;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--clr-primary-deep);
   background: var(--clr-white);
   border: 1px solid var(--clr-border);
   border-radius: 6px;
   transition: var(--transition);
}

.service-fleet-nav button:hover {
   color: var(--clr-white);
   background: var(--clr-secondary);
   border-color: var(--clr-secondary);
}

.service-fleet-swiper { overflow: hidden; padding: 2px; }
.service-fleet-swiper .swiper-slide { height: auto; }

.service-fleet-card {
   overflow: hidden;
   background: var(--clr-white);
   border: 2px solid var(--clr-secondary);
   border-radius: 8px;
}

.service-fleet-image {
   width: 100%;
   aspect-ratio: 3 / 2;
   display: flex;
   align-items: center;
   justify-content: center;
   background: var(--clr-white);
   border-bottom: 1px solid var(--clr-border);
   overflow: hidden;
}

.service-fleet-image img {
   width: 100%;
   height: 100%;
   display: block;
   object-fit: contain;
   object-position: center;
}

.service-fleet-body { padding: 18px 20px 20px; }

@media (max-width: 767.98px) {
   .service-fleet { padding: 55px 0 80px; }
   .service-fleet-heading { align-items: flex-start !important; }
}

@media (max-width: 575.98px) {
   .service-fleet-heading { flex-direction: column; gap: 20px !important; }
   .service-fleet-nav { align-self: flex-end; }
   .service-fleet-nav button { width: 38px; height: 38px; }
}