:root {
    --primary-color  : #de0108;
    --dark-color     : #00000f;
    --light-color    : #ffffff;
    --border-color   : rgba(67, 67, 92, 0.2);
    --secondary-color: #1e40af;
}

body {
    font-family     : 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding-top     : 90px;
    background-color: #f8f9fa;
}

/* top header satrt here  */
.top-bar {
    background-color: var(--primary-color);
    color           : var(--light-color);
    padding         : 8px 0;
    position        : fixed;
    top             : 0;
    left            : 0;
    width           : 100%;
    z-index         : 1030;
    box-shadow      : 0 2px 5px rgba(0, 0, 0, 0.1);
    transition      : transform 0.3s ease;
}

.top-bar.hide {
    transform: translateY(-100%);
}

.top-bar-content {
    display        : flex;
    justify-content: space-evenly;
    align-items    : center;
    flex-wrap      : wrap;
}

.contact-info {
    display     : flex;
    /* flex-wrap: wrap; */
    gap         : 20px;

}

.contact-item {
    display    : flex;
    align-items: center;
    gap        : 8px;
    font-size  : 14px;
}

.contact-item a {
    color          : var(--light-color);
    text-decoration: none;
    transition     : all 0.3s ease;
    font-size      : 16px;
    font-weight    : 500;
}

.contact-item a:hover {
    color          : var(--dark-color);
    text-decoration: underline;
}

.contact-icon {
    font-size : 17px;
    width     : 20px;
    text-align: center;
}


/* Responsive Design */
@media (max-width: 768px) {
    .top-bar-content {
        justify-content: center;
    }

    .contact-info {
        justify-content: center;
        gap            : 15px;
    }

    .contact-item {
        font-size: 13px;
    }
}

@media (max-width: 576px) {
    .contact-info {
        flex-direction: column;
        gap           : 5px;
        align-items   : center;
    }

    .contact-item {
        font-size: 12px;
    }

    .top-bar {
        padding: 10px 0;
    }
}

/* loader start here  */
#preloader {
    position       : fixed;
    top            : 0;
    left           : 0;
    width          : 100%;
    height         : 100%;
    background     : #111;
    display        : flex;
    justify-content: center;
    align-items    : center;
    z-index        : 9999;
    transition     : opacity .6s ease;
}

.loader-logo img {
    width    : 120px;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity  : .6;
    }

    50% {
        transform: scale(1.1);
        opacity  : 1;
    }

    100% {
        transform: scale(1);
        opacity  : .6;
    }
}

#preloader.fade-out {
    opacity   : 0;
    visibility: hidden;
}

/* back to top start here  */
.scroll-to-top {
    position       : fixed;
    bottom         : 30px;
    right          : 30px;
    background     : #d70007;
    color          : #fff;
    padding        : 12px 18px;
    border-radius  : 50%;
    font-size      : 16px;
    font-weight    : 600;
    text-decoration: none;
    display        : flex;
    align-items    : center;
    /* gap         : 8px; */
    box-shadow     : 0 5px 15px rgba(0, 0, 0, 0.2);
    opacity        : 0;
    pointer-events : none;
    transition     : all 0.4s ease;
    z-index        : 1000;
    height         : 47px;
}

.scroll-to-top i {
    font-size: 16px;
}

.scroll-to-top.show {
    opacity       : 1;
    pointer-events: auto;
    transform     : translateY(0);
}

.scroll-to-top:hover {
    background: #e64a19;
    color     : var(--light-color);
}

/* mouse effect start here  */

/* mouse effect end here  */
/* Navbar styles */
.navbar-fastfix {
    background-color: var(--dark-color);
    padding         : 0;
    box-shadow      : 0 2px 15px rgba(0, 0, 0, 0.2);
}

.navbar-brand img {
    width       : 200px;
    /* padding  : 4px 0; */
    border-right: 1px solid #ff000033;
}



.nav-link {
    font-weight   : 600;
    color         : var(--light-color);
    padding       : 32px 20px;
    position      : relative;
    text-transform: uppercase;
    font-size     : 16px;

}


.nav-link:hover,
.nav-link.active {
    color: var(--primary-color);
}

.dropdown-menu {
    background-color: var(--dark-color);
    border          : none;
    border-radius   : 0;
    padding         : 15px 0;
    box-shadow      : 0 5px 15px rgba(0, 0, 0, 0.3);
}

.dropdown-item {
    color      : var(--light-color);
    padding    : 10px 25px;
    font-weight: 500;
}

.dropdown-item:hover {
    background-color: var(--primary-color);
    color           : var(--dark-color);
}

.dropdown-toggle::after {
    margin-left   : 8px;
    vertical-align: middle;
}

/* Default bootstrap handle karega */
.dropdown-menu {
    opacity   : 0;
    transform : translateY(10px);
    transition: all 0.3s ease;
}

/* Jab show class add hoti hai (desktop hover ya mobile click) */
.dropdown-menu.show {
    opacity  : 1;
    transform: translateY(0);
}

.navbar-nav li {
    margin: 0 10px;
}

/* Custom toggler */
.navbar-toggler {
    border       : 2px solid var(--primary-color);
    padding      : 8px 10px;
    border-radius: 4px;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.navbar-toggler-icon {
    background-image: none;
    width           : 25px;
    height          : 20px;
    position        : relative;
}

.navbar-toggler-icon span {
    display         : block;
    height          : 3px;
    width           : 100%;
    background-color: var(--primary-color);
    position        : absolute;
    left            : 0;
    transition      : all 0.3s ease;
}

.navbar-toggler-icon span:nth-child(1) {
    top: 0;
}

.navbar-toggler-icon span:nth-child(2) {
    top: 8px;
}

.navbar-toggler-icon span:nth-child(3) {
    top: 16px;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(1) {
    transform: rotate(45deg);
    top      : 8px;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(2) {
    opacity: 0;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(3) {
    transform: rotate(-45deg);
    top      : 8px;
}

/* Sticky header behavior */
.sticky-navbar {
    position     : fixed;
    top          : 35px;
    /* Height of top bar */
    left         : 0;
    right        : 0;
    z-index      : 1020;
    transition   : all 0.3s ease;
    border-bottom: 1px solid rgba(255, 0, 0, 0.2);
}

.sticky-navbar.sticky-top {
    top: 0;
}

.book-btn {
    margin-left: 15px;
    border-left: 1px solid #ff000033;
}

.book-btn a {
    display           : inline-flex;
    justify-content   : space-between;
    align-items       : center;
    flex-direction    : row;
    column-gap        : 16px;
    border            : none;
    outline           : none !important;
    background-color  : #D70007;
    color             : #FFFFFF;
    font-family       : "Montserrat", sans-serif;
    font-size         : 15px;
    line-height       : 26px;
    font-weight       : 700;
    height            : 46px;
    border-radius     : 0;
    padding           : 0 27px;
    transition        : 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition   : 0.3s ease-in-out;
    text-transform    : capitalize;
    position          : relative;
    overflow          : hidden;
    text-align        : center;
    z-index           : 2;
    text-decoration   : none;
    text-transform    : uppercase;
}

.book-btn a::after {
    background        : #02223d none repeat scroll 0 0;
    bottom            : 0;
    content           : "";
    height            : 101%;
    left              : 0;
    position          : absolute;
    transform         : scale(0);
    -moz-transform    : scale(0);
    -webkit-transform : scale(0);
    -ms-transform     : scale(0);
    -o-transform      : scale(0);
    transition        : all 0.2s linear 0s;
    -moz-transition   : all 0.2s linear 0s;
    -webkit-transition: all 0.2s linear 0s;
    -ms-transition    : all 0.2s linear 0s;
    -o-transition     : all 0.2s linear 0s;
    width             : 100%;
    z-index           : -1;
}

.book-btn a:hover::after {
    transform        : scale(1);
    -moz-transform   : scale(1);
    -webkit-transform: scale(1);
    -ms-transform    : scale(1);
    -o-transform     : scale(1);
}

.book-btn a:hover {
    background: var(--primary-color);
    color     : #FFFFFF;
}



/* hero section start here  */
/* Main Slider Styles */
.main-slider-one {
    position: relative;
    overflow: hidden;
    width   : 100%;
}

.main-slider-one__carousel {
    position: relative;
    width   : 100%;
}

.main-slider-one__item {
    background-color: var(--light-color);
    position        : relative;
    z-index         : 3;
    padding-top     : 155px;
    padding-bottom  : 121px;
    height          : 100vh;
    min-height      : 700px;
    display         : flex;
    align-items     : center;
}

.main-slider-one__shape {
    position: absolute;
    left    : 16px;
    top     : 0;
    z-index : 1;
}

.main-slider-one__shape img {
    max-width: 100%;
    height   : auto;
    animation: zoomBig 6s linear infinite;
}

@keyframes zoomBig {
    0% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(0.9, 0.9);
    }

    100% {
        transform: scale(1, 1);
    }
}

.main-slider-one__bg {
    background         : url(../images/slider-home.jpg);
    position           : absolute;
    top                : 0;
    left               : 0;
    right              : 0;
    bottom             : 0;
    background-size    : cover;
    background-repeat  : no-repeat;
    background-position: center;
    overflow           : hidden;
    clip-path          : polygon(0 0, 100% 0, 100% 90.8%, 0 99.8%);
    z-index            : -1;
}

.main-slider-one__content {
    position: relative;
    z-index : 3;
    color   : var(--light-color);
}

.main-slider-one__sub-title {
    font-size    : 24px;
    line-height  : 34px;
    font-weight  : 700;
    color        : var(--light-color);
    margin-bottom: 15px;

}

.main-slider-one__title {
    color      : var(--light-color);
    font-size  : 60px;
    line-height: 86px;
    font-weight: 700;
    margin     : 0 0 34px;
}

.main-slider-one__title span {
    color   : var(--light-color);
    position: relative;
    z-index : 1;
}

.main-slider-one__title span::after {
    position        : absolute;
    right           : 0;
    left            : -11px;
    margin          : auto;
    bottom          : 11px;
    width           : 109%;
    height          : 79%;
    content         : '';
    background-color: var(--primary-color);
    animation       : shapeMove 3s linear 0s infinite;
    z-index         : -1;
    clip-path       : polygon(10% 0, 100% 0%, 88% 100%, 0 100%);
}

@keyframes shapeMove {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(5px);
    }
}

.main-slider-one__btn {
    position       : relative;
    display        : flex;
    justify-content: flex-start;
    align-items    : center;
    margin-bottom  : 40px;
    flex-wrap      : wrap;
    gap            : 30px;
}

.ripcar-btn {
    display         : inline-flex;
    align-items     : center;
    background-color: var(--primary-color);
    color           : var(--light-color);
    padding         : 15px 30px;
    text-decoration : none;
    font-weight     : 700;
    border-radius   : 4px;
    transition      : all 0.3s ease;
}

.ripcar-btn:hover {
    background-color: var(--dark-color);
    color           : #f8f9fa;
}

.ripcar-btn i {
    margin-left: 10px;
}




.main-slider-one__scrollDown {
    display        : inline-flex;
    align-items    : center;
    color          : rgba(255, 255, 255, 0.7);
    font-weight    : 700;
    text-decoration: none;
    transition     : all 0.3s ease;
}

.main-slider-one__scrollDown:hover {
    color: var(--primary-color);
}

.main-slider-one__scrollDown i {
    display         : flex;
    align-items     : center;
    justify-content : center;
    width           : 60px;
    height          : 60px;
    border          : 1px solid var(--primary-color);
    background-color: var(--primary-color);
    color           : var(--light-color);
    border-radius   : 50%;
    margin-left     : 15px;
    transition      : all 0.3s ease;
}

.main-slider-one__scrollDown:hover i {
    background-color: transparent;
    color           : var(--primary-color);
}

.main-slider-one__thumb {
    position: absolute;
    bottom  : -33px;
    right   : -3.2%;
    z-index : 2;
}

.main-slider-one__thumb img {
    max-width: 100%;
    height   : auto;
}

/* Owl Carousel Customization */
.owl-nav {
    position      : absolute;
    left          : 50px;
    top           : 50%;
    transform     : translateY(-50%);
    display       : flex;
    flex-direction: column;
    gap           : 20px;
    z-index       : 10;
}

.owl-nav button {
    width           : 52px;
    height          : 52px;
    outline         : none;
    box-shadow      : none;
    border          : none;
    background-color: rgba(255, 255, 255) !important;
    border-radius   : 50%;
    display         : flex;
    align-items     : center;
    justify-content : center;
    color           : var(--light-color);
    transition      : all 0.4s ease;
}

.owl-nav button:hover {
    background-color: var(--primary-color);
    color           : #D70007 !important;
}

.owl-dots {
    position      : absolute;
    right         : 60px;
    top           : 50%;
    transform     : translateY(-50%);
    display       : flex;
    flex-direction: column;
    gap           : 15px;
}

.owl-dots button {
    outline   : none;
    box-shadow: none;
    border    : none;
    background: transparent;
}

.owl-dots button span {
    width           : 13px;
    height          : 13px;
    display         : block;
    border-radius   : 0;
    background-color: transparent;
    border          : 3px solid var(--light-color);
    transition      : all 0.3s ease;
}

.owl-dots button.active span,
.owl-dots button:hover span {
    background-color: var(--light-color);
}






/* hero section end here  */

/* services text slider start here  */
/* Slide Text Section */
.slide-text {
    position: relative;
    z-index : 99;
    padding : 80px 0 30px;
    overflow: hidden;
    margin  : -80px 0;
}

.slide-text__one {
    background : var(--primary-color);
    padding    : 26px 0 25px;
    position   : relative;
    white-space: nowrap;
    z-index    : 2;
}

.slide-text__one__list {
    margin         : 0;
    padding        : 0;
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    flex-wrap      : wrap;
    animation      : text-scrolling 22s linear infinite;
    will-change    : transform;
    flex-wrap      : nowrap;
    gap            : 114px;
    list-style     : none;
}

.slide-text__one__list li {
    position       : relative;
    display        : flex;
    justify-content: center;
    align-items    : center;
    flex-direction : row;
    letter-spacing : 0;
    margin         : 0;
    color          : var(--light-color);
    font-size      : 35px;
    line-height    : 50px;
    font-weight    : 700;
    font-family    : 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-transform : uppercase;
}

.slide-text__one__list li::after {
    position     : absolute;
    content      : "";
    right        : -84px;
    top          : -2px;
    width        : 54px;
    height       : 54px;
    border       : 2px solid var(--light-color);
    border-radius: 50%;
}

.slide-text__one__list:hover {
    animation-play-state: paused;
}

@keyframes text-scrolling {
    from {
        transform: translateX(0%);
    }

    to {
        transform: translateX(-100%);
    }
}

.slide-text__two {
    background : var(--off-white);
    overflow   : hidden;
    padding    : 26px 0 25px;
    position   : relative;
    top        : -79px;
    left       : -22px;
    z-index    : 1;
    transform  : rotate(-6.19deg);
    width      : calc(100% + 72px);
    box-shadow : 0px -1px 7px rgba(0, 0, 0, .03);
    white-space: nowrap;
}

.slide-text__two__list {
    margin         : 0;
    padding        : 0;
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    flex-wrap      : wrap;
    animation      : text-scrolling-two 22s linear infinite;
    will-change    : transform;
    flex-wrap      : nowrap;
    gap            : 114px;
    list-style     : none;
}

.slide-text__two__list li {
    position       : relative;
    display        : flex;
    justify-content: center;
    align-items    : center;
    flex-direction : row;
    letter-spacing : 0;
    margin         : 0;
    color          : var(--dark-color);
    font-size      : 35px;
    line-height    : 50px;
    font-weight    : 700;
    font-family    : 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-transform : uppercase;
}

.slide-text__two__list li::after {
    position     : absolute;
    content      : "";
    right        : -84px;
    top          : -2px;
    width        : 54px;
    height       : 54px;
    border       : 2px solid var(--dark-color);
    border-radius: 50%;
}

.slide-text__two__list:hover {
    animation-play-state: paused;
}

@keyframes text-scrolling-two {
    from {
        transform: translate(-100%, 0);
    }

    to {
        transform: translate(0, 0);
    }
}




/* About Section */
.about-two {
    position        : relative;
    z-index         : 1;
    padding         : 120px 0 150px;
    background-color: var(--light-color);
}

.about-two__image {
    position : relative;
    max-width: 570px;
}

.about-two__image>img {
    max-width    : 100%;
    height       : auto;
    border-radius: 8px;
    box-shadow   : 0 10px 30px rgba(0, 0, 0, 0.1);
}

.about-two__image img:nth-child(1) {
    z-index : 3;
    position: relative;
}

.about-two__image img:nth-child(2) {
    position : absolute;
    right    : 10px;
    bottom   : 30px;
    z-index  : 3;
    max-width: 70%;
    border   : 5px solid var(--light-color);
}



.about-two__image::after {
    content   : "";
    position  : absolute;
    right     : 0;
    bottom    : 90px;
    width     : 24px;
    height    : 183px;
    background: var(--primary-color);
    z-index   : 1;
}

.about-two__fact {
    position        : absolute;
    left            : 0;
    bottom          : -30px;
    width           : 366px;
    height          : 192px;
    padding         : 0 30px 14px;
    background-color: var(--primary-color);
    color           : var(--light-color);
    display         : flex;
    flex-direction  : column;
    justify-content : center;
    z-index         : 5;
}

.about-two__fact__icon {
    color          : var(--light-color);
    font-size      : 26px;
    display        : flex;
    justify-content: center;
    align-items    : center;
    width          : 60px;
    height         : 60px;
    background     : var(--dark-color);
    margin-top     : -28px;
    margin-bottom  : 24px;
}

.about-two__fact__count {
    margin     : 0 0 6px;
    color      : var(--light-color);
    font-size  : 76px;
    line-height: 86px;
    display    : flex;
    align-items: center;
    font-weight: 700;
}

.about-two__fact__text {
    color      : var(--light-color);
    font-weight: 500;
    font-size  : 16px;
    line-height: 26px;
    margin     : 0;
}

.about-two__content {
    position: relative;
    padding : 19px 0 0;
}

.sec-title__tagline {
    color         : var(--primary-color);
    font-weight   : 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom : 0px;
    display       : flex;
    align-items   : center;
    font-size     : 45px;
}


.sec-title__title {
    font-size  : 42px;
    line-height: 42px;
    font-weight: 700;
    color      : var(--dark-color);

    font-style: italic;
}

.about-two__content__text {
    font-size    : 16px;
    line-height  : 26px;
    color        : var(--body-color);
    margin-bottom: 5px;
}

.about-two__content__item {
    margin-bottom: 30px;
}

.about-two__content__item__icon {
    font-size    : 60px;
    color        : var(--primary-color);
    margin-bottom: 15px;
}

.about-two__content__item__title {
    font-size    : 22px;
    font-weight  : 700;
    color        : var(--dark-color);
    margin-bottom: 10px;
}

.about-two__content__item__text {
    font-size  : 16px;
    line-height: 26px;
    color      : var(--body-color);
    margin     : 0;
}

/* Animations */
@keyframes welAnim {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.fadeInUp {
    animation: fadeInUp 1s ease forwards;
    opacity  : 0;
}

@keyframes fadeInUp {
    from {
        opacity  : 0;
        transform: translateY(40px);
    }

    to {
        opacity  : 1;
        transform: translateY(0);
    }
}

.fadeInRight {
    animation: fadeInRight 1s ease forwards;
    opacity  : 0;
}

@keyframes fadeInRight {
    from {
        opacity  : 0;
        transform: translateX(40px);
    }

    to {
        opacity  : 1;
        transform: translateX(0);
    }
}


/* our service section start here  */
/* Services Section */
.fastfix-services {
    position  : relative;
    padding   : 50px 0;
    background: var(--dark-color);
    overflow  : hidden;
}

.fastfix-services__shape {
    position: absolute;
    left    : 16px;
    top     : 110px;
    opacity : 1.1;
    z-index : 1;
}

.fastfix-services__title-wrap {
    margin-bottom: 50px;
}

.fastfix-services__tagline {
    color          : var(--primary-color);
    font-weight    : 600;
    text-transform : uppercase;
    letter-spacing : 1px;
    margin-bottom  : 15px;
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.fastfix-services__tagline-line {
    width           : 40px;
    height          : 2px;
    background-color: var(--primary-color);
    margin-right    : 10px;
}

.fastfix-services__main-title {
    font-size    : 42px;
    line-height  : 52px;
    font-weight  : 700;
    color        : var(--light-color);
    margin-bottom: 25px;
    text-align   : center;
}

/* Service Items */
.fastfix-service-item {
    position     : relative;
    background   : rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    overflow     : hidden;
    transition   : all 0.3s ease;
    height       : 100%;
    margin       : 15px;
}

.fastfix-service-item__content {
    padding       : 24px 24px 30px;
    border        : 1px solid var(--border-color);
    background    : transparent;
    height        : 100%;
    display       : flex;
    flex-direction: column;
}

.fastfix-service-item__image {
    position     : relative;
    overflow     : hidden;
    margin-bottom: 20px;
    border-radius: 6px;
}

.fastfix-service-item__image img {
    width     : 100%;
    height    : 200px;
    object-fit: cover;
    transition: all 0.4s ease;
}

.fastfix-service-item__icon {
    position        : absolute;
    top             : 50%;
    left            : 50%;
    font-size       : 22px;
    background-color: var(--primary-color);
    color           : var(--light-color);
    width           : 62px;
    height          : 32px;
    border-radius   : 20px;
    cursor          : pointer;
    opacity         : 0;
    visibility      : hidden;
    display         : flex;
    justify-content : center;
    align-items     : center;
    transition      : all 0.4s ease;
    transform       : translate(-50%, -50%) scale3d(0, 0, 0);
    text-decoration : none;
}

.fastfix-service-item__type {
    font-size      : 16px;
    line-height    : 26px;
    font-weight    : 500;
    color          : #fff;
    display        : inline-block;
    margin-bottom  : 5px;
    transition     : all 0.3s ease;
    text-decoration: none;
}

.fastfix-service-item__title {
    font-size    : 17px;
    line-height  : 32px;
    font-weight  : 700;
    color        : var(--light-color);
    margin-bottom: 15px;
}

.fastfix-service-item__title a {
    color          : inherit;
    text-decoration: none;
    transition     : all 0.3s ease;
}

/* Hover Effects */
.fastfix-service-item:hover {
    transform : translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.fastfix-service-item:hover .fastfix-service-item__icon {
    opacity   : 1;
    visibility: visible;
    transform : translate(-50%, -50%) scale3d(1, 1, 1);
}

.fastfix-service-item:hover .fastfix-service-item__type {
    color: var(--primary-color);
}

.fastfix-service-item:hover .fastfix-service-item__title a {
    color: var(--primary-color);
}

.fastfix-service-item:hover .fastfix-service-item__image img {
    transform: scale(1.05);
}

/* Owl Carousel Customization */
.fastfix-services-carousel.owl-carousel .owl-stage {
    padding: 0px 0;
}

.fastfix-services-carousel .owl-nav {
    position: absolute;
    top     : -90px;
    right   : 0;
    display : flex;
}

.fastfix-services-carousel .owl-nav button {
    width          : 50px;
    height         : 50px;
    border-radius  : 50%;
    background     : rgba(255, 255, 255, 0.1);
    color          : var(--light-color);
    display        : flex;
    align-items    : center;
    justify-content: center;
    margin         : 0 5px;
    transition     : all 0.3s ease;
    border         : 1px solid var(--border-color);
}

.fastfix-services-carousel .owl-nav button:hover {
    background: var(--primary-color);
    color     : var(--light-color);
}


/* Features Section */

.fastfix-feature-item {
    text-align      : center;
    padding         : 30px 20px;
    /* background   : rgba(255, 255, 255, 0.05); */
    border-radius   : 8px;
    transition      : all 0.3s ease;
    height          : 100%;
    border          : 1px solid var(--border-color);
}

.fastfix-feature-item:hover {
    transform : translateY(-5px);
    background: rgba(255, 255, 255, 0.1);
}

.fastfix-feature-item__icon {
    font-size    : 48px;
    color        : var(--primary-color);
    margin-bottom: 20px;
}

.fastfix-feature-item__title {
    font-size    : 20px;
    font-weight  : 700;
    color        : var(--light-color);
    margin-bottom: 15px;
}

.fastfix-feature-item__text {
    color : rgba(255, 255, 255, 0.7);
    margin: 0;
}


/* our service section end here  */



/* testimonail section start here  */
.testimonial-section {
    position    : relative;
    width       : 100%;
    /* max-width: 1200px; */
    margin      : 0 auto;
    padding     : 60px 0;
    overflow    : hidden;
}

.section-header {
    text-align   : center;
    margin-bottom: 60px;
    position     : relative;
    z-index      : 2;
}


.section-subtitle {
    font-size: 1.1rem;
    color    : #666;
    max-width: 600px;
    margin   : 0 auto;
}

.testimonial-card {
    background   : var(--light-color);
    border-radius: 15px;
    padding      : 30px;
    box-shadow   : 0 15px 50px rgba(0, 0, 0, 0.1);
    transition   : all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    position     : relative;
    overflow     : hidden;
    margin       : 15px;
}

.testimonial-card::before {
    content   : '';
    position  : absolute;
    top       : 0;
    left      : 0;
    width     : 100%;
    height    : 5px;
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
}

.testimonial-card:hover {
    transform : translateY(-10px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

.quote-icon {
    position : absolute;
    top      : 20px;
    right    : 20px;
    font-size: 60px;
    color    : rgba(160, 5, 9, 0.1);
    z-index  : 0;
}

.testimonial-content {
    position: relative;
    z-index : 1;
}

.testimonial-text {
    font-size    : 1.1rem;
    line-height  : 1.8;
    color        : #444;
    margin-bottom: 20px;
    position     : relative;
    padding-left : 20px;
    border-left  : 3px solid var(--primary-color);
}

.testimonial-author {
    display    : flex;
    align-items: center;
    margin-top : 25px;
}

.author-img {
    width        : 70px;
    height       : 70px;
    border-radius: 50%;
    overflow     : hidden;
    margin-right : 15px;
    border       : 3px solid var(--primary-color);
    box-shadow   : 0 5px 15px rgba(0, 0, 0, 0.1);
}

.author-img img {
    width     : 100%;
    height    : 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.testimonial-card:hover .author-img img {
    transform: scale(1.1);
}

.author-info h4 {
    font-size    : 1.2rem;
    font-weight  : 600;
    color        : var(--dark-color);
    margin-bottom: 5px;
}

.author-info p {
    font-size    : 0.9rem;
    color        : var(--primary-color);
    margin-bottom: 0;
}

.rating {
    display: flex;
    margin : 15px 0;
    color  : red;
}

.rating i {
    color       : var(--accent-color);
    margin-right: 5px;
    font-size   : 1.1rem;
}

.decoration {
    position: absolute;
    z-index : 0;
}

.decoration-1 {
    top      : 10%;
    left     : 5%;
    font-size: 150px;
    color    : rgba(160, 5, 9, 0.05);
    transform: rotate(-15deg);
}

.decoration-2 {
    bottom   : 10%;
    right    : 5%;
    font-size: 120px;
    color    : rgba(160, 5, 9, 0.05);
    transform: rotate(10deg);
}






/* testimonial section end here  */

/* footer start here  */
footer {
    background: var(--dark-color);
    color     : var(--light-color);
    padding   : 60px 0;
    position  : relative;
    overflow  : hidden;
}

footer::before,
footer::after {
    content   : "";
    position  : absolute;
    top       : 0;
    left      : -50%;
    width     : 200%;
    height    : 2px;
    background: var(--primary-color);

}

footer::after {
    top                : auto;
    bottom             : 0;
    animation-direction: reverse;
}



.footer-title {
    font-size    : 20px;
    font-weight  : 600;
    margin-bottom: 20px;
    position     : relative;
    display      : inline-block;
}

.footer-title::before {
    content   : "";
    position  : absolute;
    bottom    : -5px;
    left      : 0;
    width     : 40%;
    height    : 2px;
    background: var(--primary-color);
}

.footer-logo img {
    width: 200px;

}

.footer-logo i {
    font-size: 24px;
}

.footer-contact {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    flex-wrap      : wrap;
    gap            : 15px;
}





.social-icons {
    display: flex;
    gap    : 15px;
}

.social-icon {
    position        : relative;
    display         : flex;
    align-items     : center;
    justify-content : center;
    width           : 40px;
    height          : 40px;
    font-size       : 18px;
    color           : #fff;
    border-radius   : 50%;
    overflow        : hidden;
    transition      : color 0.3s ease;
    background-color: var(--primary-color);
}

/* background effect using ::before */
.social-icon::before {
    content      : "";
    position     : absolute;
    inset        : 0;
    border-radius: 50%;
    background   : rgba(255, 255, 255, 0.15);
    transform    : scale(0);
    transition   : transform 0.3s ease;
    z-index      : -1;
}

/* hover effect */
.social-icon:hover::before {
    transform: scale(1);
}

.social-icon.fb:hover {
    color: #ffffff;
}

.social-icon.ig:hover {
    color: #ffffff;
}

.social-icon.yp:hover {
    color: #ffffff;
}

.footer-contact .phone {
    font-size  : 22px;
    font-weight: bold;
    margin-top : 15px;
}

.footer-contact a {
    text-decoration: none;
    color          : var(--light-color);
    font-weight    : 600;
}

.footer-contact .phone i {
    background   : var(--primary-color);
    padding      : 10px;
    border-radius: 50%;
    margin-right : 10px;
    color        : var(--light-color);
}

.footer-links ul {
    list-style: none;
    padding   : 0;
}

.footer-links ul li {
    margin-bottom: 8px;
}

.footer-links ul li a {
    text-decoration: none;
    color          : var(--light-color);
    transition     : all 0.3s;
}

.footer-links ul li a:hover {
    color       : var(--primary-color);
    padding-left: 5px;
}

.footer-info i {
    margin-right: 10px;
    color       : var(--primary-color);
}

.footer-info p a {
    text-decoration: none;
    color          : var(--light-color);
}

.main-bottom-footer a {
    text-decoration: none;
    color          : var(--primary-color);
}

.main-bottom-footer a img {
    padding-top: 5px;
}

/* footer end here  */

/* why choose us start here  */
.feature-section {
    position: relative;
    padding : 100px 0 50px;
}

.sec-tagline {
    color         : var(--primary-color);
    font-size     : 1.1rem;
    font-weight   : 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom : 15px;
    display       : block;
}

.sec-title {
    font-size    : 2.5rem;
    font-weight  : 700;
    color        : var(--dark-color);
    margin-bottom: 20px;
}

.feature-content {
    position  : relative;
    margin-top: -7px;
}

.feature-text {
    margin     : 15px 0 35px;
    font-size  : 1.1rem;
    color      : #666;
    line-height: 1.8;
}

.ripcar-btn {
    display         : inline-flex;
    align-items     : center;
    background-color: var(--dark-color);
    color           : var(--light-color);
    padding         : 12px 30px;
    text-decoration : none;
    font-weight     : 500;
    border-radius   : 4px;
    transition      : all 0.3s ease;
    position        : relative;
    overflow        : hidden;
    margin-bottom   : 40px;
}

.ripcar-btn:hover {
    background-color: var(--primary-color);
    color           : var(--light-color);
}

.ripcar-btn i {
    margin-left: 10px;
    transition : transform 0.3s ease;
}

.ripcar-btn:hover i {
    transform: translateX(5px);
}

.feature-img {
    max-width    : 100%;
    border-radius: 8px;
    box-shadow   : 0 10px 30px rgba(0, 0, 0, 0.1);
}

.feature-item {
    position        : relative;
    z-index         : 1;
    display         : flex;
    align-items     : center;
    gap             : 25px;
    border          : 1px solid var(--border-color);
    transition      : all 0.4s ease;
    padding         : 20px 25px;
    margin-bottom   : 25px;
    border-radius   : 8px;
    background-color: var(--light-color);
    text-decoration : none;
    color           : inherit;
}

.feature-item::after {
    content         : "";
    position        : absolute;
    top             : -1px;
    left            : 0;
    bottom          : 0;
    width           : 100%;
    background-color: var(--primary-color);
    z-index         : -1;
    transform       : scale(1, 0);
    perspective     : 400px;
    visibility      : hidden;
    transition      : transform 0.5s ease, visibility 0.5s ease;
    transform-origin: bottom center;
    border-radius   : 8px;
}

.feature-item:hover {
    border-color: var(--primary-color);
    transform   : translateY(-5px);
    box-shadow  : 0 10px 25px rgba(0, 0, 0, 0.1);
}

.feature-item:hover::after {
    transform       : scale(1, 1);
    visibility      : visible;
    transform-origin: top center;
}

.feature-item__icon {
    position   : relative;
    display    : flex;
    align-items: center;
    font-size  : 40px;
    line-height: 1;
    color      : var(--primary-color);
    transition : all 0.5s ease;
    flex-shrink: 0;
}

.feature-item:hover .feature-item__icon {
    color    : var(--light-color);
    transform: scale(1.1);
}

.feature-item__title {
    font-size  : 22px;
    font-weight: 600;
    transition : all 0.3s ease;
    margin     : 0 0 8px;
}

.feature-item:hover .feature-item__title {
    color: var(--light-color);
}

.feature-item__text {
    margin    : 0;
    color     : #666;
    transition: all 0.3s ease;
}

.feature-item:hover .feature-item__text {
    color: var(--light-color);
}

/* Animation classes */
.bw-split-in-left div {
    position : relative;
    display  : inline-block;
    transform: translate(0px, 0px);
    opacity  : 1;
}

.wow {
    visibility: visible;
}

.fadeInLeft {
    animation-name: fadeInLeft;
}

.fadeInRight {
    animation-name: fadeInRight;
}

@keyframes fadeInLeft {
    from {
        opacity  : 0;
        transform: translate3d(-30px, 0, 0);
    }

    to {
        opacity  : 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInRight {
    from {
        opacity  : 0;
        transform: translate3d(30px, 0, 0);
    }

    to {
        opacity  : 1;
        transform: translate3d(0, 0, 0);
    }
}

.animated {
    animation-duration : 1s;
    animation-fill-mode: both;
}




/* inner page start here hero section  */
/* Page Header Styles */
.page-header {
    padding            : 150px 0 116px;
    position           : relative;
    background-size    : cover;
    background-position: center;
    background-repeat  : no-repeat;
    color              : white;
    overflow           : hidden;
    background         : url(../images/inner-bg.jpg);
    background-position: center;
    background-repeat  : no-repeat;
    object-fit         : cover;
}

.page-header::before {
    content   : '';
    position  : absolute;
    top       : 0;
    left      : 0;
    width     : 100%;
    height    : 100%;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 20%, rgba(255, 255, 255, 0) 100%);
    z-index   : 1;
}

.page-header .container {
    position: relative;
    z-index : 2;
}

.page-header-box {
    max-width  : 650px;
    padding-top: 38px;
}

/* Text Animation */
.text-anime {
    padding-top   : 0px;
    font-size     : 42px !important;
    letter-spacing: 4px;
    line-height   : 1.2;
    font-weight   : 700 !important;
}


/* Breadcrumb Styles */
.breadcrumb {
    background: transparent;
    padding   : 0;
    margin    : 20px 0 0;
}

.breadcrumb-item {
    color    : rgba(255, 255, 255, 0.8);
    font-size: 16px;
}

.breadcrumb-item a {
    color          : white;
    text-decoration: none;
    transition     : all 0.3s;
}

.breadcrumb-item a:hover {
    color: var(--primary-color);
}

.breadcrumb-item.active {
    color: var(--primary-color);
}

.breadcrumb-item+.breadcrumb-item::before {
    color  : rgba(255, 255, 255, 0.6);
    content: ">";
}

/* Content Section */
.content-section {
    padding: 80px 0;
}

.section-title {
    position         : relative;
    margin-bottom    : 40px;
    /* padding-bottom: 15px; */
}



.feature-box {
    padding      : 30px;
    border-radius: 10px;
    box-shadow   : 0 5px 25px rgba(0, 0, 0, 0.1);
    transition   : all 0.3s;
    height       : 100%;
}

.feature-box:hover {
    transform : translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.feature-icon {
    font-size    : 2.5rem;
    color        : var(--primary-color);
    margin-bottom: 20px;
}



/* end here  */

/* about us missinon section start here  */

.cleaning-services {
    padding         : 80px 0;
    background-color: var(--light-color);
}

.cleaning-services-left {
    position: relative;
}

.cleaning-services-img {
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    margin-bottom  : 30px;
}

.cleaning-services-img figure {
    width        : 48%;
    overflow     : hidden;
    border-radius: 10px;
    box-shadow   : 0 5px 15px rgba(0, 0, 0, 0.1);
}

.cleaning-services-img img {
    width     : 100%;
    height    : auto;
    transition: transform 0.5s ease;
}

.cleaning-services-img img:hover {
    transform: scale(1.05);
}

.cleaning-services-counter {
    position        : absolute;
    right           : 0;
    bottom          : -20px;
    display         : inline-block;
    background-color: var(--primary-color);
    border          : 10px solid var(--light-color);
    text-align      : center;
    padding         : 20px;
    border-radius   : 8px;
    box-shadow      : 0 5px 15px rgba(0, 0, 0, 0.1);
}

.cleaning-services-counter h3 {
    font-size  : 64px;
    font-weight: 700;
    color      : var(--light-color);
    margin     : 0;
}

.cleaning-services-counter p {
    color      : var(--light-color);
    font-weight: 500;
    margin     : 0;
}

.cleaning-services-content {
    padding-left: 30px;
}


.section-title h3 {
    color        : var(--dark-color);
    font-size    : 22px;
    margin-bottom: 15px;
}

.text-anime .line {
    overflow : hidden;
    display  : block;
    width    : 100%;
    font-size: 40px;
}

.text-anime .word {
    display      : inline-block;
    overflow     : hidden;
    padding-right: 0.3em;
}



.about-page-content p {
    margin-bottom: 20px;
    color        : #4b5563;
    font-size    : 16px;
    line-height  : 1.8;
}

.cleaning-services-content-list ul {
    list-style: none;
    padding   : 0;
    margin    : 0;
}

.cleaning-services-content-list ul li {
    font-size    : 18px;
    color        : var(--primary-color);
    margin-bottom: 15px;
    display      : flex;
    align-items  : center;
}

.cleaning-services-content-list ul li:last-child {
    margin-bottom: 0;
}

.cleaning-services-content-list ul li i {
    font-size      : 20px;
    color          : var(--accent-background);
    margin-right   : 15px;
    background     : rgba(255, 61, 36, 0.1);
    width          : 40px;
    height         : 40px;
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
}

/* truck repair start here  */
.our-work-page {
    padding         : 80px 0;
    background-color: var(--light-color);
}

.work-box {
    background   : var(--light-color);
    border-radius: 10px;
    overflow     : hidden;
    box-shadow   : 0 5px 20px rgba(0, 0, 0, 0.08);
    transition   : all 0.3s ease;
    margin-bottom: 30px;
    height       : 100%;
}

.work-box:hover {
    transform : translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

.work-img {
    position: relative;
    overflow: hidden;
}

.work-img figure {
    margin  : 0;
    overflow: hidden;
}

.work-img img {
    width     : 100%;
    height    : 220px;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.work-box:hover .work-img img {
    transform: scale(1.1);
}

.work-img h3 {
    position  : absolute;
    bottom    : 0;
    left      : 0;
    right     : 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    color     : var(--light-color);
    margin    : 0;
    padding   : 20px 15px 10px;
    font-size : 18px;
}

.work-content {
    padding: 20px;
}

.work-content h3 {
    color        : var(--dark-color);
    font-size    : 20px;
    margin-bottom: 10px;
}

.work-content p {
    color        : #6b7280;
    margin-bottom: 20px;
    font-size    : 15px;
    line-height  : 1.6;
}

.btn-default {
    display        : inline-block;
    background     : var(--primary-color);
    color          : var(--light-color);
    padding        : 10px 20px;
    border-radius  : 5px;
    text-decoration: none;
    font-weight    : 500;
    transition     : all 0.3s ease;
    border         : 2px solid var(--primary-color);
}

.btn-default:hover {
    background: transparent;
    color     : var(--primary-color);
}

/* Animation */
@keyframes fadeInUp {
    from {
        opacity  : 0;
        transform: translateY(20px);
    }

    to {
        opacity  : 1;
        transform: translateY(0);
    }
}

.wow.fadeInUp {
    animation-name     : fadeInUp;
    animation-duration : 0.8s;
    animation-fill-mode: both;
}

.padding-card {
    padding: 10px 10px;
}


/* gallery page start here  */
.gallery-page {
    padding: 80px 0;
}

.gallery-page__card {
    position     : relative;
    overflow     : hidden;
    border-radius: 8px;
    margin-bottom: 24px;
    box-shadow   : 0 5px 15px rgba(0, 0, 0, 0.1);
    cursor       : pointer;
}

.gallery-page__card img {
    width     : 100%;
    height    : 250px;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.gallery-page__card:hover img {
    transform: scale(1.1);
}

.img-popup {
    position       : absolute;
    top            : 0;
    left           : 0;
    right          : 0;
    bottom         : 0;
    background     : rgba(222, 1, 8, 0.8);
    display        : flex;
    align-items    : center;
    justify-content: center;
    opacity        : 0;
    transition     : all 0.3s ease;
    text-decoration: none;
}

.gallery-page__card:hover .img-popup {
    opacity: 1;
}

.img-popup span {
    color          : var(--light-color);
    font-size      : 24px;
    width          : 60px;
    height         : 60px;
    border         : 2px solid var(--light-color);
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    transition     : all 0.3s ease;
}

.img-popup:hover span {
    background: var(--light-color);
    color     : var(--primary-color);
}

/* Custom Lightbox */
.custom-lightbox {
    position       : fixed;
    top            : 0;
    left           : 0;
    width          : 100%;
    height         : 100%;
    background     : rgba(0, 0, 0, 0.9);
    display        : flex;
    align-items    : center;
    justify-content: center;
    z-index        : 9999;
    opacity        : 0;
    visibility     : hidden;
    transition     : all 0.3s ease;
}

.custom-lightbox.active {
    opacity   : 1;
    visibility: visible;
}

.lightbox-content {
    position  : relative;
    max-width : 90%;
    max-height: 90%;
}

.lightbox-content img {
    max-width    : 100%;
    max-height   : 80vh;
    border-radius: 8px;
    box-shadow   : 0 5px 25px rgba(0, 0, 0, 0.2);
    padding: 35px;
}

.lightbox-caption {
    color     : var(--light-color);
    text-align: center;
    margin-top: 15px;
    font-size : 18px;
}

.lightbox-close {
    position  : absolute;
    top       : 39px;
    right     : 0px;
    color     : var(--light-color);
    font-size : 30px;
    background: red;
    border    : none;
    cursor    : pointer;
    transition: all 0.3s ease;
    z-index   : 9999;
}

.lightbox-close:hover {
    color: var(--primary-color);
}

.lightbox-nav {
    position       : absolute;
    top            : 50%;
    width          : 100%;
    display        : flex;
    justify-content: space-between;
    transform      : translateY(-50%);
    padding        : 0 20px;
}

.lightbox-prev,
.lightbox-next {
    color          : var(--light-color);
    font-size      : 30px;
    background     : rgba(0, 0, 0, 0.5);
    width          : 50px;
    height         : 50px;
    border-radius  : 50%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    cursor         : pointer;
    transition     : all 0.3s ease;
}

.lightbox-prev:hover,
.lightbox-next:hover {
    background: var(--primary-color);
}






/* gallery page end here  */

/* contact page start here  */
.contact-call-to-action {
    padding   : 100px 0 50px;
    background: #202020ed;
}

.header-contact-box {
    background      : var(--primary-color);
    padding         : 30px;
    text-align      : center;
    height          : 100%;
    /* border-radius: 10px; */
    box-shadow      : 0 5px 20px rgba(0, 0, 0, 0.1);
    transition      : transform 0.3s ease;
    border          : 1px solid var(--border-color);
}

.header-contact-box:hover {
    transform : translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.contact-icon-box {
    margin-bottom: 20px;
}

.contact-icon-box i {
    font-size: 40px;
    color    : var(--light-color);
}

.header-contact-info h3 {
    color         : var(--light-color);
    font-weight   : 700;
    font-size     : 22px;
    text-transform: uppercase;
    margin        : 10px 0;
}

.header-contact-info p {
    color        : var(--light-color);
    font-weight  : 500;
    font-size    : 18px;
    line-height  : 1.4;
    margin-bottom: 5px;
}

.header-contact-info a {
    color          : var(--light-color);
    text-decoration: none;
    transition     : opacity 0.3s;
}

.header-contact-info a:hover {
    opacity: 0.8;
    color  : var(--dark-color);
}



.get-in-touch {
    padding   : 26px 0 100px;
    background: #303030;
}

.section-title-2 h3 {
    color        : var(--primary-color);
    font-weight  : 600;
    margin-bottom: 15px;
    font-size    : 24px;
}

.section-title-2 h3 {
    color        : var(--light-color);
    font-weight  : 700;
    font-size    : 48px;
    margin-bottom: 50px;
    position     : relative;
    display      : inline-block;
}

.section-title-2 h3::after {
    content         : '';
    position        : absolute;
    bottom          : -10px;
    left            : 0;
    width           : 80px;
    height          : 4px;
    background-color: var(--primary-color);
}

.form-group label {
    color         : #fff;
    font-weight   : 600;
    font-size     : 18px;
    padding-bottom: 6px;
    display       : block;
}

.form-group input,
.form-group textarea {
    background   : var(--transparent-color);
    border-color : rgba(255, 255, 255, 0.25);
    border-width : 0 0 1px 0;
    border-radius: 0;
    font-size    : 18px;
    font-weight  : 500;
    padding      : 10px 0;
    color        : var(--text-color);
    width        : 100%;
    transition   : all 0.3s ease;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color  : var(--light-color);
    opacity: 0.5;
}

.form-group input:focus,
.form-group textarea:focus {
    outline         : none;
    box-shadow      : none;
    background-color: var(--transparent-color);
    color           : var(--text-color);
    border-color    : var(--primary-color);
    border-width    : 0 0 2px 0;
}

.help-block.with-errors ul {
    margin    : 0;
    padding   : 0;
    list-style: none;
}

.help-block.with-errors ul li {
    color      : var(--error-color);
    font-weight: 500;
    font-size  : 14px;
    margin-top : 5px;
}

.btn-default {
    background-color: var(--primary-color);
    color           : var(--light-color);
    border          : none;
    padding         : 12px 30px;
    font-size       : 18px;
    font-weight     : 600;
    border-radius   : 4px;
    cursor          : pointer;
    transition      : all 0.3s ease;
}

.btn-default:hover {
    background-color: var(--light-color);
    color           : var(--primary-color);
}

/* Animation for the title */
@keyframes fadeIn {
    from {
        opacity  : 0;
        transform: translateY(20px);
    }

    to {
        opacity  : 1;
        transform: translateY(0);
    }
}

.text-anime {
    animation: fadeIn 1s ease-out forwards;
}


/* contact page end here  */


/* service details page start here  */
.cs_service_details {
    background   : var(--white-color);
    padding      : 30px;
    border-radius: 10px;
    box-shadow   : 0 5px 15px rgba(0, 0, 0, 0.05);
}

.cs_service_details h3 {
    color         : var(--dark-color);
    font-weight   : 700;
    margin        : 25px 0 15px;
    position      : relative;
    padding-bottom: 10px;
    font-size     : 28px;
}

.cs_service_details h3:after {
    content         : '';
    position        : absolute;
    bottom          : 0;
    left            : 0;
    width           : 60px;
    height          : 3px;
    background-color: var(--primary-color);
}

.cs_service_details h4 {
    color      : var(--dark-color);
    font-weight: 600;
    margin     : 20px 0 12px;
    font-size  : 22px;
}

.cs_service_details p {
    margin-bottom: 20px;
    font-size    : 16px;
    color        : #444;
}

.cs_service_details img {
    border-radius: 8px;
    margin-bottom: 20px;
    width        : 100%;
    height       : auto;
}

.cs_list {
    padding   : 0;
    margin    : 0;
    list-style: none;
}

.cs_list li {
    display      : flex;
    align-items  : center;
    margin-bottom: 15px;
}

.cs_list_icon {
    display        : inline-flex;
    width          : 30px;
    height         : 30px;
    margin-right   : 15px;
    border-radius  : 50%;
    align-items    : center;
    justify-content: center;
    flex-shrink    : 0;
}

.cs_accent_bg {
    background-color: var(--primary-color);
}

.cs_white_color {
    color: var(--light-color);
}

.cs_radius_50 {
    border-radius: 50%;
}


.cs_accordian {
    margin-bottom: 15px;
    border       : 1px solid var(--primary-color);
    border-radius: 8px;
    overflow     : hidden;
}




.cs_accordian_body {
    padding   : 0 20px;
    max-height: 0;
    overflow  : hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.cs_accordian_body.show {
    padding   : 20px;
    max-height: 500px;
}


.cs_accordian.active .cs_accordian_body {
    padding   : 20px;
    max-height: 500px;
}

.service-banner {
    position     : relative;
    margin-bottom: 30px;
    border-radius: 10px;
    overflow     : hidden;
}

.service-banner img {
    width : 100%;
    height: auto;
}

.service-banner-overlay {
    position  : absolute;
    bottom    : 0;
    left      : 0;
    right     : 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
    padding   : 20px;
    color     : var(--light-color);
}

.service-banner-overlay h3 {
    color        : var(--light-color);
    margin-bottom: 10px;
}


/* Responsive adjustments */
@media (max-width: 992px) {
    .cs_service_details {
        padding: 25px;
    }

    .cs_service_details h3 {
        font-size: 24px;
    }

    .cs_service_details h4 {
        font-size: 20px;
    }
}

@media (max-width: 768px) {
    .cs_service_details {
        padding: 20px;
    }

    .cs_service_details h3 {
        font-size: 22px;
    }

    .cs_service_details h4 {
        font-size: 19px;
    }



}

@media (max-width: 576px) {
    .cs_service_details {
        padding: 15px;
    }

    .cs_service_details h3 {
        font-size: 20px;
    }

    .cs_service_details h4 {
        font-size: 18px;
    }

    .cs_list_icon {
        width       : 25px;
        height      : 25px;
        margin-right: 10px;
    }






    .cs_accordian_body {
        padding: 0 15px;
    }

    .cs_accordian_body.show {
        padding: 15px;
    }



}

/* service details page end here  */

/* get a quote start here  */
.quote-section {
    padding: 80px 0;
}

.quote-container {
    background   : var(--light-color);
    border-radius: 10px;
    box-shadow   : 0 5px 25px rgba(0, 0, 0, 0.1);
    overflow     : hidden;
}

.quote-form {
    padding: 30px;
}

.form-title {
    color         : var(--dark-color);
    font-weight   : 700;
    margin-bottom : 25px;
    position      : relative;
    padding-bottom: 15px;
}

.form-title:after {
    content         : '';
    position        : absolute;
    bottom          : 0;
    left            : 0;
    width           : 60px;
    height          : 3px;
    background-color: var(--primary-color);
}

.form-control {
    border       : 1px solid var(--border-color);
    border-radius: 5px;
    padding      : 12px 15px;
    margin-bottom: 20px;
    font-size    : 16px;
    transition   : all 0.3s;
}

.form-control:focus {
    border-color: var(--primary-color);
    box-shadow  : 0 0 0 0.2rem rgba(222, 1, 8, 0.25);
}

textarea.form-control {
    min-height: 120px;
    resize    : vertical;
}

.btn-quote {
    background-color: var(--primary-color);
    color           : var(--light-color);
    border          : none;
    padding         : 12px 30px;
    font-size       : 18px;
    font-weight     : 600;
    border-radius   : 5px;
    width           : 100%;
    transition      : all 0.3s;
}

.btn-quote:hover {
    background-color: var(--dark-color);
}

.quote-image {
    height             : 100%;
    background-image   : url('../images/get-bg.jpg');
    background-size    : cover;
    background-position: center;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .quote-form {
        padding: 25px;
    }

    .quote-image {
        height: 300px;
    }
}

@media (max-width: 768px) {
    .quote-section {
        padding: 60px 0;
    }

    .quote-form {
        padding: 20px;
    }

    .form-title {
        font-size: 24px;
    }
}

@media (max-width: 576px) {
    .quote-form {
        padding: 15px;
    }

    .form-title {
        font-size: 22px;
    }

    .form-control {
        padding  : 10px 12px;
        font-size: 15px;
    }
}