*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

:root{
    --primary:#E71C1C;
    --secondary:#2672D8;
    --accent:#F67F0D;
    --dark:#252A31;
    --gray:#6C757D;
    --light:#F8FAFC;
    --white:#fff;
}
h2{ 
    font-size: 48px !important;
 }
 h3{
    font-size: 24px !important;
 }
 p{
    font-size: 17px !important;
 }
body{

    font-family:'Poppins',sans-serif;

    overflow-x:hidden;
    
}

/* ================= NAVBAR ================= */

.navbar {
    background: #fff;
    padding: 5px 0;
    border-bottom: 1px solid #e7e7e7;
    box-shadow: 0 10px 35px rgb(0 0 0 / 24%);
}

.navbar-brand img{

    width: 70px;
}

.navbar-nav{

    gap:20px;
}

.nav-link{

    color:var(--dark) !important;

    font-weight:600 !important;

    transition:.3s;
}

.nav-link:hover{

    color:var(--primary) !important;
}

.nav-link.active{

    color:var(--primary) !important;
}

.signin-btn{

    color:var(--dark);

    text-decoration:none;

    font-weight:600;
}

.booking{

    text-decoration:none;

    color:#fff;

    background:var(--secondary);

    padding:12px 28px;

    border-radius:6px;

    font-weight:600;

    box-shadow:0 12px 30px rgb(246,127,13,.3);

    transition:.3s;
}

.booking:hover{

    background:var(--accent);

    color:#fff;
}

/* ================= HERO ================= */

.hero{

    position:relative;

    min-height:100vh;

    display:flex;

    align-items:center;

    padding-top:100px;

    overflow:hidden;
}

.hero-bg{

    position:absolute;

    width:900px;

    height:900px;

    background:#fff1ed;

    border-radius:50%;

    top:-180px;

    right:-260px;

    z-index:-1;
}

.subtitle{

    font-size:22px;

    font-weight:600;

    margin-bottom:20px;
    color: var(--secondary);
}

.hero h1{

    font-size:52px;

    font-weight:800;

    line-height:1.1;

    color:var(--dark);
}

.hero h1 span{

    color:var(--primary);
}

.hero p{

    margin:30px 0;

    color:var(--gray);

    line-height:1.8;

    font-size:16px;

    max-width:520px;
}

.hero-btn{

    display:flex;

    gap:20px;

    flex-wrap:wrap;
}

.book-btn{

    background:var(--primary);

    color:#fff;

    text-decoration:none;

    padding:18px 20px;

    border-radius:6px;

    font-weight:600;

    box-shadow:0 15px 30px rgba(255,76,48,.35);
}

.book-btn:hover{

    background:var(--accent);

    color:#fff;
}

.talk{

    background:var(--secondary);

    color:#fff;

    text-decoration:none;

    padding:18px 20px;

    border-radius:6px;

    font-weight:600;
}

.talk:hover{

    color:#fff;

    background:var(--accent);
}

.car-image{

    width:115%;

    position:relative;

    right:-60px;
}

/* ================= Responsive ================= */

@media(max-width:991px){

.hero{

    text-align:center;

    min-height:auto;

    padding:100px 0 80px;
}

.hero h1{

    font-size:48px;
}

.subtitle{

    font-size:22px;
}

.hero p{

    margin:auto;

    margin-top:25px;

    margin-bottom:35px;
}

.hero-btn{

    justify-content:center;
}

.hero-bg{

    width:600px;

    height:600px;

    right:-250px;
}

.navbar-collapse{

    background:#fff;

    margin-top:15px;

    padding:20px;

    border-radius:8px;

    text-align:center;
}

.d-flex{

    justify-content:center;

    margin-top:20px;
}

}

@media(max-width:576px){

.hero h1{

    font-size:38px;
}

.book-btn,

.talk{

    width:100%;

    text-align:center;
}

.hero-bg{

    width:420px;

    height:420px;
}
}

.booking-section{

    position:relative;
    padding-top:80px;
}

.booking-card{

    background:#fff;

    border-radius:20px;
    border: 1px solid #e7e7e7;

    padding:50px;

    position:relative;

    box-shadow:0 15px 40px rgba(0,0,0,.08);
}


.booking-title{

    font-size:45px;

    font-weight:800;

    color:#252A31;
}

.booking-title span{

    color:#E71C1C;
}

.title-line{

    display:flex;

    gap:5px;

    margin:15px 0 40px;
}

.title-line span{

    width:55px;

    height:4px;

    border-radius:20px;
}


.booking-card label{

    font-weight:600;

    margin-bottom:10px;

    color:#252A31;

    display:block;
}

.form-control,
.form-select{

    height:60px;

    border-radius:10px;

    border:1px solid #d9dee7;

    font-size:16px;

    box-shadow:none;
}

.form-control:focus,
.form-select:focus{

    border-color:#2672D8;

    box-shadow:0 0 0 .15rem rgba(38,114,216,.15);
}

.book-btn {
    height: 60px;
    border: none;
    display: flex;
    justify-content: center;
    border-radius: 10px;
    background: #E71C1C;
    color: #fff;

    font-weight:600;

    transition:.3s;
}



.book-btn i{

    margin-left:10px;
}

@media(max-width:992px){

.booking-card{

    padding:30px;
}

.offer-badge{

    position:static;

    display:inline-block;

    margin-bottom:25px;
}

.booking-title{

    font-size:35px;
}

}

@media(max-width:576px){

.booking-card{

    padding:25px;
}

.booking-title{

    font-size:30px;
}

.title-line span{

    width:40px;
}

}


.services{

    background:#fff;
}

.section-subtitle{

    color:var(--blue);

    font-weight:700;

    letter-spacing:2px;

    margin-bottom:10px;
}

.section-title{

    font-size:42px;

    font-weight:800;

    color:var(--dark);
}

.section-title span{

    color:var(--red);
}

.service-card{

    background:#fff;

    border-radius:22px;

    padding-top:30px;

    border: 1px solid #e7e7e7;

    box-shadow:0 10px 35px rgba(0,0,0,.08);

    transition:.4s;

    height:100%;
}

.service-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,0,0,.12);
}

.service-icon{

    width:75px;

    height:75px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;


    color:#fff;
}

.service-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.service-content {
    flex: 1;
}

.service-card img.img-fluid {
    margin-top: auto;
    width: 100%;
    display: block;
}

.red{

    background:var(--red);
}

.blue{

    background:var(--blue);
}

.orange{

    background:var(--orange);
}

.service-card h3{

    font-size:22px;

    font-weight:700;

    color:var(--dark);

    margin-bottom:18px;

    position:relative;
}

.service-card h3::after{

    content:"";

    display:block;

    width:100%;

    height:1px;

    background:#ddd;

    margin-top:15px;
}

.service-card p{

    color:var(--text);

    line-height:1.8;

    margin:25px 0;
}

.service-card a{

    text-decoration:none;

    color:var(--dark);

    font-weight:700;

    transition:.3s;
}

.service-card a:hover{

    color:var(--red);
}

.service-card img {
    width: 100%;
    /* height: 240px; */
    object-fit: cover;
    border-radius: 18px;
    /* margin-top: 30px; */
}

@media(max-width:992px){

.section-title{

    font-size:34px;
}

.service-card{

    padding:25px;
}

}

@media(max-width:576px){

.section-title{

    font-size:28px;
}

.service-card h3{

    font-size:24px;
}



}


.how-it-works{

    padding:100px 0;
    background:#fff;
}

.section-subtitle{

    color:var(--secondary);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:15px;
}

.section-title{

    font-size:50px;
    font-weight:800;
    color:var(--dark);

    margin-top:10px;
    margin-bottom:70px;
}

.step-box{

    position:relative;
    padding:20px;
}

.step-box h3{

    margin-top:30px;
    margin-bottom:18px;

    font-size:34px;
    font-weight:700;
    color:var(--dark);
}

.step-box p{

    color:var(--text);
    line-height:1.8;
    font-size:17px;
}

/* Icon */

.icon-bg{

    width:120px;
    height:120px;

    margin:auto;

    border-radius:35px;

    background:#FFF2F1;

    display:flex;
    align-items:center;
    justify-content:center;

    position:relative;
}

.icon-bg::before{

    content:"";

    position:absolute;

    width:85px;
    height:85px;

    background:#fff;

    border-radius:25px;

    transform:rotate(-15deg);
}

.icon-bg i{

    position:relative;
    z-index:2;

    font-size:48px;
    color:var(--primary);
}

.icon-bg.blue{

    background:#EAF3FF;
}

.icon-bg.blue i{

    color:var(--secondary);
}

.icon-bg.orange{

    background:#FFF5E8;
}

.icon-bg.orange i{

    color:var(--accent);
}

/* Dashed connector */

@media(min-width:992px){

.step-box::after{

    content:"";

    position:absolute;

    top:60px;
    right:-70px;

    width:140px;

    border-top:2px dashed #d8d8d8;
}

.col-lg-4:last-child .step-box::after{

    display:none;
}

}

/* Responsive */

@media(max-width:992px){

.section-title{

    font-size:38px;
}

.step-box h3{

    font-size:28px;
}

}

@media(max-width:576px){

.how-it-works{

    padding:70px 0;
}

.section-title{

    font-size:30px;
}

.icon-bg{

    width:100px;
    height:100px;
}

.icon-bg i{

    font-size:40px;
}

.step-box h3{

    font-size:24px;
}

}



/* ===========================
   Fleet Section
=========================== */

.fleet-section{
    padding:90px 0;
    background:var(--white);
    overflow:hidden;
}

/* ===========================
   Heading
=========================== */

.section-subtitle{

    color:var(--accent);
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:1px;
    font-size:15px;

}

.section-title{

    font-size:48px;
    font-weight:700;
    color:var(--dark);

}

.section-text{

    color:var(--text);
    max-width:600px;
    font-size:16px;

}

/* ===========================
   Vehicle Tabs
=========================== */

.vehicle-btn{

    background:var(--white);
    border:none;
    padding:15px 20px;
    border-radius:10px;
    font-weight:600;
    color:var(--dark);
    border: 1px solid #e7e7e7;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    transition:.3s;
    cursor:pointer;

}

.vehicle-btn:hover{

    background:var(--accent);
    color:var(--white);

}

.vehicle-btn.active{

    background:var(--primary);
    color:var(--white);

}

/* ===========================
   Image Section
=========================== */

.car-wrapper{

    position:relative;
    text-align:center;

}

.car-bg{

    width:450px;
    height:450px;
    background:#EAF2FD;
    border-radius:50%;
    position:absolute;
    left:-120px;
    bottom:-100px;
    z-index:0;

}

#carImage{

    position:relative;
    z-index:2;
    max-width:100%;
    transition:.4s ease;

}

/* ===========================
   Details Card
=========================== */

.fleet-details{

    background:var(--white);
    border-radius:12px;
    padding:30px;
    box-shadow:0 12px 30px rgba(0,0,0,.06);

}

.price{

    font-size:58px;
    font-weight:700;
    color:var(--dark);
    margin-bottom:5px;
    transition:.3s;

}

.rent{

    color:var(--text);
    font-size:15px;

}

/* ===========================
   Table
=========================== */

.fleet-table{

    margin-bottom:0;

}

.fleet-table tr td{

    padding:14px 0;
    font-size:15px;
    border-color:#edf1f5;

}

.fleet-table tr td:first-child{

    font-weight:600;
    color:var(--dark);

}

.fleet-table tr td:last-child{

    color:var(--text);
    text-align:right;
    font-weight:500;

}



/* ===========================
   Phone
=========================== */

.phone{

    color:var(--dark);
    font-weight:600;
    transition:.3s;

}

.phone i{

    color:var(--primary);
    margin-right:6px;

}

.phone:hover{

    color:var(--secondary);

}

/* ===========================
   Animation
=========================== */

.price,
#model,
#doors,
#seats,
#luggage,
#gear,
#ac,
#fuel{

    transition:.3s;

}

/* ===========================
   Responsive
=========================== */

@media(max-width:991px){

    .fleet-section{

        padding:60px 0;

    }

    .section-title{

        font-size:36px;

    }

    .car-bg{

        display:none;

    }

    .fleet-details{

        margin-top:20px;

    }

    .price{

        font-size:42px;

    }

    .vehicle-btn{

        width:100%;

    }

    .fleet-table tr td:last-child{

        text-align:left;

    }

}

@media(max-width:576px){

    .section-title{

        font-size:30px;

    }

    .price{

        font-size:36px;

    }

        nav .book-btn {
        width: 50%;
        justify-content: center;
    }


    .phone{

        width:100%;
        text-align:center;

    }

}

.navbar-toggler{
    
}
/* Hamburger Button */
.custom-toggler{
    width: 50px;
    height: 50px;
    border: none;
    background: transparent;
    height: 50px;
    display: flex;
    gap: 5px;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;

    padding: 0;
}

/* Hamburger Lines */
.custom-toggler span{
    display: block;
    width: 28px;
    height: 3px;
    background: var(--dark);
    border-radius: 10px;

    transition: all 0.3s ease;
}

/* Hover Effect */
.custom-toggler:hover span{
    background: #f5c542;
}

/* Remove Bootstrap Focus */
.custom-toggler:focus{
    box-shadow: none;
}
```
```css id="hf7q2n"
/* =========================
   Navbar Toggler
========================= */

.custom-toggler{
    width: 45px;
    height: 45px;
    border: none;
    background: transparent;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;

    padding: 0;
    position: relative;
}


/* Remove Bootstrap Focus */
.custom-toggler:focus{
    box-shadow: none;
}

/* Hover */
.custom-toggler:hover span{
    background: #f5c542;
}

/* =========================
   Mobile Menu Style
========================= */

@media (max-width: 1199px){

    .navbar-collapse{
        background: rgba(0,0,0,0.95);
        padding: 25px;
        border-radius: 18px;
        margin-top: 20px;
        text-align: center;
    }

    .navbar-nav{
        gap: 12px;
    }

    .nav-link{
        font-size: 18px;
        color: #fff !important;
    }

    .book-btn{
        margin-top: 15px;
        display: inline-block;
    }
}
```


/*==============================
    About Section
===============================*/

.about-section{
    padding:100px 0;
    background:var(--white);
    overflow:hidden;
}

.about-images{
    position:relative;
    min-height:620px;
}

/* Large Image */

.main-img{
    width:380px;
    height:520px;
    border-radius:220px;
    overflow:hidden;
    border:8px solid var(--white);
    box-shadow:0 20px 60px rgba(0,0,0,.12);
}

.main-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Small Image */

.small-img{
    position:absolute;
    bottom:0;
    right:20px;
    width:290px;
    height:390px;
    border-radius:180px;
    overflow:hidden;
    border:8px solid var(--white);
    box-shadow:0 20px 60px rgba(0,0,0,.12);
}

.small-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Decorative Shapes */

.shape-star{
    position:absolute;
    top:80px;
    right:40px;
    font-size:90px;
    color:var(--accent);
    font-weight:700;
    line-height:1;
}

.shape-diamond{
    position:absolute;
    left:180px;
    bottom:20px;
    font-size:55px;
    color:var(--dark);
}

/*==============================
        Content
===============================*/

.section-subtitle{
    display:inline-flex;
    align-items:center;
    color:var(--accent);
    font-weight:600;
    font-size:17px;
}

.section-title{
    color:var(--dark);
    font-size:54px;
    font-weight:700;
    line-height:1.2;
}

.section-text{
    color:var(--text);
    line-height:1.9;
    margin-bottom:40px;
}

/*==============================
      Feature Box
===============================*/

.feature-box{
    display:flex;
    align-items:flex-start;
    gap:20px;
    padding:25px 0;
}

.feature-box:not(:last-child){
    border-bottom:1px solid #ececec;
}

.feature-icon-1{
    width:75px;
    height:75px;
    background:#ffe7e7;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.feature-icon-2{
    width:75px;
    height:75px;
    background:#ebf4ff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.feature-icon-1 i{
    font-size:34px;
    color:var(--primary);
}
.feature-icon-2 i{
    font-size:34px;
    color:var(--secondary);
}

.feature-content h33{
    color:var(--dark);
    font-size:24px;
    font-weight:600;
    margin-bottom:10px;
}

.feature-content p{
    color:var(--text);
    line-height:1.8;
    margin:0;
}

/*==============================
      Hover Effects
===============================*/

.main-img,
.small-img{
    transition:.4s ease;
}

.main-img:hover{
    transform:translateY(-8px);
}

.small-img:hover{
    transform:translateY(-8px);
}

.feature-icon{
    transition:.3s;
}

.feature-box:hover .feature-icon-1{
    background:var(--primary);
}

.feature-box:hover .feature-icon-2{
    background:var(--secondary);
}

.feature-box:hover .feature-icon i{
    color:var(--white);
}

/*==============================
      Responsive
===============================*/

@media(max-width:991px){

    .about-section{
        padding:70px 0;
    }

    .about-images{
        min-height:520px;
        margin-bottom:40px;
    }

    .main-img{
        width:300px;
        height:420px;
    }

    .small-img{
        width:220px;
        height:300px;
        right:0;
    }

    .shape-star{
        font-size:70px;
        right:10px;
    }

    .shape-diamond{
        left:120px;
    }

    .section-title{
        font-size:40px;
    }

    .feature-content h5{
        font-size:22px;
    }

}

@media(max-width:576px){

    .about-images{
        min-height:430px;
    }

    .main-img{
        width:250px;
        height:350px;
    }

    .small-img{
        width:180px;
        height:240px;
    }

    .shape-star{
        display:none;
    }

    .shape-diamond{
        display:none;
    }

    .section-title{
        font-size:32px;
    }

    .feature-box{
        flex-direction:column;
        text-align:center;
        align-items:center;
    }

    .feature-content h5{
        font-size:20px;
    }

}


/*==============================
    WHY CHOOSE US
==============================*/

.why-choose{
    padding:100px 0;
    background:var(--white);
    overflow:hidden;
}

/* Heading */

.section-subtitle{
    display:inline-flex;
    align-items:center;
    color:var(--accent);
    font-size:16px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.5px;
}

.section-title{
    color:var(--dark);
    font-size:54px;
    font-weight:700;
    line-height:1.2;
}

/*==============================
    FEATURE ITEMS
==============================*/

.feature-item{
    display:flex;
    align-items:flex-start;
    gap:18px;
    padding:15px 0;
}

.feature-icon{
    width:65px;
    height:65px;
    min-width:65px;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:.35s;
}

.feature-icon i{
    font-size:28px;
    transition:.35s;
}

.feature-content h3{
    color:var(--dark);
    font-size:24px;
    font-weight:700;
    margin-bottom:10px;
}

.feature-content p{
    color:var(--text);
    line-height:1.8;
    margin:0;
}

.feature-item:hover .feature-icon-{
    background:var(--primary);
    transform:translateY(-5px);
}

.feature-item:hover .feature-icon-2{
    background:var(--secondary);
    transform:translateY(-5px);
}

.feature-item:hover .feature-icon i{
    color:#fff;
}

hr{
    border-color:#ececec;
    opacity:1;
}

/*==============================
    CENTER IMAGE
==============================*/

.why-image{
    position:relative;
    width:auto;
    height:auto;
    margin:auto;
}

.city-image{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:220px;
    box-shadow:0 20px 60px rgba(0,0,0,.12);
}

.city-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Car */

.car-image{
    left:50%;
    transform:translateX(-50%);
    width:105%;
    z-index:5;
    transition:.4s;
}

.car-image:hover{
    transform:translateX(-50%) translateY(-8px);
}

/*==============================
    RESPONSIVE
==============================*/

@media(max-width:1200px){

    .why-image{
        width:360px;
        height:460px;
    }

    .feature-content h4{
        font-size:24px;
    }

}

@media(max-width:991px){

    .why-choose{
        padding:70px 0;
    }

    .section-title{
        font-size:38px;
    }

    .why-image{
        margin:50px auto;
    }

    .feature-item{
        text-align:left;
    }

}

@media(max-width:767px){

    .section-title{
        font-size:30px !important;
    }

    .why-image{
        width:280px;
        height:360px;
    }
.about-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

    .feature-item{
        flex-direction:column;
        align-items:center;
        text-align:center;
    }

    .feature-content h4{
        font-size:22px;
    }

    .car-image{
        width:110%;
    }

}

.testimonial-section{
    padding:100px 0;
}

.swiper-slide{
    height:auto;
    display:flex;
}

.testimonial-card{
    background:#fff;
    border-radius:15px;
    padding:35px;
    transition:.3s;
border: 1px solid #e7e7e7;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08);
    display:flex;
    flex-direction:column;
    width:100%;
}

.testimonial-card:hover{

    transform:translateY(-8px);

}

.quote{

    width:60px;
    height:60px;
    background:var(--primary-orange);
    color:var(--primary);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    margin-bottom:20px;

}

.rating{
    display:flex;
    align-items:center;
    gap:5px;
    margin-bottom:20px;
}

.rating i{
    color:var(--accent);
    font-size:20px;
}
.testimonial-card p{

    color:var(--text);
    line-height:1.8;
    margin-bottom:25px;

}

.client{

    display:flex;
    align-items:center;
    gap:15px;

}
.client{
    display:flex;
    align-items:center;
    gap:15px;
    margin-top:auto;
}

.swiper-wrapper{
    align-items:stretch;
}

.swiper-slide{
    display:flex;
    height:auto;
}

.testimonial-card{
    width:100%;
}

.client img{

    width:70px;
    height:70px;
    border-radius:50%;
    object-fit:cover;
    border:3px solid var(--primary-blue);

}

.client h5{

    margin:0;
    color:var(--dark);
    font-weight:600;

}

.client span{

    color:var(--text);
    font-size:14px;

}

.swiper-pagination-bullet{

    background:var(--primary-orange);
    opacity:.4;

}

.swiper-pagination-bullet-active{

    background:var(--primary-blue);
    opacity:1;

}

.footer-section{
    background:#0f172a;
    color:#fff;
    padding:100px 0 30px;
    position:relative;
}

.footer-cta{
    background:linear-gradient(135deg,#f59e0b,#ffcb45);
    border-radius:20px;
    padding:40px;
    color:#111;
    margin-top:-170px;
    margin-bottom:70px;
    box-shadow:0 25px 60px rgba(0,0,0,.25);
}

.footer-cta h2{
    font-size:2rem;
    font-weight:700;
}

.footer-cta p{
    margin:10px 0 0;
    opacity:.8;
}

.footer-logo{
    width:100px;
}

.footer-text{
    color:#cbd5e1;
    line-height:1.9;
}

.footer-section h5{
    margin-bottom:25px;
    font-weight:700;
    position:relative;
}

.footer-section h5::after{
    content:"";
    width:45px;
    height:3px;
    background:#f59e0b;
    position:absolute;
    left:0;
    bottom:-10px;
    border-radius:20px;
}

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

.footer-section ul li{
    margin-bottom:15px;
    color:#cbd5e1;
}

.footer-section ul li a{
    color:#cbd5e1;
    text-decoration:none;
    transition:.3s;
}

.footer-section ul li a:hover{
    color:#f59e0b;
    padding-left:8px;
}

.social-links{
    display:flex;
    gap:15px;
    margin-top:30px;
}

.social-links a{
    width:48px;
    height:48px;
    border-radius:50%;
    background:#1e293b;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-decoration:none;
    transition:.3s;
    font-size:20px;
}

.social-links a:hover{
    background:#f59e0b;
    color:#111;
    transform:translateY(-6px);
}

.contact-box{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.contact-box div{
    background:#ffffff24;
    border-radius:12px;
    padding:15px;
    color:#e2e8f0;
}

.contact-box i{
    color:#f59e0b;
    margin-right:10px;
}

.footer-section hr{
    border-color:#334155;
    margin:50px 0 25px;
}

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

.footer-bottom a{
    color:#cbd5e1;
    text-decoration:none;
    margin-left:25px;
}

.footer-bottom a:hover{
    color:#f59e0b;
}

@media(max-width:768px){

.footer-cta{
    margin-top:0;
    padding:30px;
}

.footer-bottom{
    text-align:center;
    justify-content:center;
}

.footer-bottom div{
    width:100%;
}

.footer-bottom a{
    margin:0 10px;
}

}

/* Banner Section */
.about-banner{
  position:relative;
  width:100%;
  max-width:1300px;
  height:420px;
  margin:auto;
  border-radius:40px;
  overflow:hidden;
}

/* Background Image */
.about-banner img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Dark Overlay */
.banner-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.55);
  z-index:1;
}

/* Content */
.banner-content{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  text-align:center;
  z-index:2;
  color:#fff;
}

.banner-content h1{
  font-size:80px;
  font-weight:700;
  margin-bottom:15px;
}

/* Breadcrumb */
.breadcrumb{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:24px;
  font-weight:600;
}

.breadcrumb a{
  color:#fff;
  text-decoration:none;
  transition:0.3s;
}

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

.breadcrumb span:last-child{
  color:var(--accent);
}

/* Responsive */
@media(max-width:768px){

  .about-banner{
    height:300px;
    border-radius:25px;
  }

  .banner-content h1{
    font-size:36px;
  }

  .breadcrumb{
    font-size:18px;
  }
}

/* =========================
   FLEET SECTION
========================= */
.fleet-section{
  overflow:hidden;
}

.sub-title{
  color:#ff5a1f;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
}

.section-heading{
  font-size:52px;
  font-weight:800;
  color:#111;
}

.section-text{
  max-width:700px;
  color:#666;
  line-height:1.8;
  margin-top:15px;
}

/* =========================
   SLIDER WRAPPER
========================= */
.fleet-slider-wrapper{
  position:relative;
}

/* =========================
   SLIDER BUTTONS
========================= */
.slider-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:65px;
  height:65px;
  border:none;
  border-radius:50%;
  background:#ff5a1f;
  color:#fff;
  font-size:22px;
  z-index:10;
  transition:0.3s ease;
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
}

.slider-btn:hover{
  background:#111;
}

.prev-btn{
  left:-85px;
}

.next-btn{
  right:-85px;
}

/* CARD */
.fleet-card{
  background:#fff;
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 12px 35px rgba(0,0,0,0.08);
  transition:0.4s ease;
border: 1px solid #e7e7e7;
  /* IMPORTANT */
  height:100%;
  display:flex;
  flex-direction:column;
}

.fleet-card:hover{
  transform:translateY(-10px);
}

.fleet-card img{
  width:100%;
  height:240px;
  object-fit:cover;
}

/* CARD CONTENT */
.fleet-content{
  padding:28px;

  /* IMPORTANT */
  display:flex;
  flex-direction:column;
  flex:1;
}

.fleet-content h4{
  font-size:24px;
  font-weight:700;
  margin-bottom:18px;
  color:#111;
}

/* CAR INFO */
.car-info{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:25px;
}

.car-info span{
  display:flex;
  align-items:center;
  gap:8px;
  color:#666;
  font-size:15px;
  font-weight:500;
}

.car-info i{
  color:#ff5a1f;
}

/* BOOK BUTTON */
.book-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;

  padding:14px 26px;
  color:#fff;
  text-decoration:none;
  border-radius:12px;
  font-weight:600;
  transition:0.3s ease;

  /* IMPORTANT */
  margin-top:auto;
}

.book-btn i{
  font-size:18px;
}


/* =========================
   RESPONSIVE
========================= */
@media(max-width:1400px){

  .prev-btn{
    left:-20px;
  }

  .next-btn{
    right:-20px;
  }

}

@media(max-width:992px){

  .section-heading{
    font-size:42px;
  }

}

@media(max-width:768px){

  .section-heading{
    font-size:34px;
  }

  .fleet-content{
    padding:22px;
  }

  .fleet-card img{
    height:220px;
  }

  .slider-btn{
    width:50px;
    height:50px;
    font-size:18px;
  }

  .prev-btn{
    left:5px;
  }

  .next-btn{
    right:5px;
  }

  .book-btn{
    width:100%;
    justify-content:center;
  }

}

/* =========================
   CONTACT SECTION
========================= */
.contact-section{
  padding:100px 0;
}

/* WRAPPER */
.contact-wrapper{
  background:#fff;
  border-radius:30px;
  padding:80px 50px;
  box-shadow:0 15px 50px rgba(0,0,0,0.06);
  position:relative;
  overflow:hidden;
}

/* TOP SHAPE */
.contact-wrapper::before{
  content:"";
  position:absolute;
  top:-120px;
  right:-120px;
  width:250px;
  height:250px;
  background:#ff5a1f;
  opacity:0.08;
  border-radius:50%;
}

/* TAG */
.contact-tag{
  display:inline-block;
  padding:10px 22px;
  background:rgba(255,90,31,0.1);
  color:#ff5a1f;
  border-radius:50px;
  font-size:14px;
  font-weight:700;
  letter-spacing:1px;
  margin-bottom:20px;
}

/* TITLE */
.contact-title{
  font-size:64px;
  font-weight:800;
  color:#111;
  margin-bottom:20px;
  text-transform:uppercase;
}

.contact-subtitle{
  max-width:700px;
  margin:auto;
  font-size:20px;
  line-height:1.8;
  color:#666;
}

/* CONTACT CARD */
.contact-card{
  background:#fff;
  border:1px solid #eee;
  border-radius:24px;
  padding:40px 30px;
  text-align:center;
  transition:0.4s ease;
  height:100%;
  position:relative;
}

.contact-card:hover{
  transform:translateY(-10px);
  border-color:#ff5a1f;
  box-shadow:0 15px 40px rgba(0,0,0,0.08);
}

/* ICON */
.icon-box{
  width:80px;
  height:80px;
  margin:0 auto 25px;
  border-radius:50%;
  background:#FFF2F1;
  display:flex;
  align-items:center;
  justify-content:center;
}

.icon-box i{
  font-size:30px;
  color:var(--primary);
}

.icon-box.blue{
    background:#EAF3FF;
}

.icon-box.blue i{
    color: var(--secondary);
}

.icon-box.orange i{
    color: var(--accent);
}

.icon-box.orange{
    background:#FFF5E8;
}

.form-label i{
    color: var(--primary);
}
.fleet-content{
    display:none;
}

.fleet-content.active{
    display:block;
}

.vehicle-btn.active{
    background:var(--primary);
    color:#fff;
}

/* CARD TITLE */
.contact-card h4{
  font-size:26px;
  font-weight:700;
  margin-bottom:15px;
  color:#111;
}

/* TEXT */
.contact-card p{
  color:#777;
  line-height:1.7;
  margin-bottom:20px;
  font-size:16px;
}

/* LINK */
.contact-card a,
.contact-card span{
  font-size:18px;
  font-weight:600;
  color:#111;
  text-decoration:none;
  line-height:1.8;
  transition:0.3s ease;
}

.contact-card a:hover{
  color:#ff5a1f;
}

/* RESPONSIVE */
@media(max-width:992px){

  .contact-title{
    font-size:48px;
  }

  .contact-wrapper{
    padding:70px 35px;
  }

}

@media(max-width:768px){

  .contact-section{
    padding:70px 0;
  }

  .contact-wrapper{
    padding:50px 20px;
    border-radius:20px;
  }

  .contact-title{
    font-size:36px;
  }

  .contact-subtitle{
    font-size:17px;
  }

  .contact-card{
    padding:35px 25px;
  }

}
/* ===============================
   Vehicle Button Slider
================================= */

.vehicle-slider{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    margin-bottom:50px;
}

.vehicle-slider-wrapper{
    overflow:hidden;
    width:100%;
}

.vehicle-slider-track{
    display:flex;
    gap:15px;
    transition:transform .5s ease;
}

/* Show 5 buttons */
.vehicle-btn{
    flex:0 0 calc((100% - 60px) / 5);
    white-space:nowrap;
}

/* Arrow Buttons */
.slider-arrow{
    width:45px;
    height:45px;
    border:none;
    border-radius:50%;
    background:#0d6efd;
    color:#fff;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.3s;
    flex-shrink:0;
}

.slider-arrow:hover{
    background:#084298;
}

/* ===============================
   Responsive
================================= */

@media (max-width:991px){

    .vehicle-btn{
        flex:0 0 calc((100% - 30px) / 3);
    }

}

@media (max-width:767px){

    .vehicle-btn{
        flex:0 0 calc((100% - 15px) / 2);
    }

}

@media (max-width:576px){

    .vehicle-btn{
        flex:0 0 100%;
    }

}
.vehicle-type{
    display:inline-block;
    background:#0d6efd15;
    color:#0d6efd;
    padding:8px 18px;
    border-radius:30px;
    font-size:14px;
    font-weight:600;
    margin-bottom:15px;
}

.vehicle-name{
    font-size:40px;
    font-weight:700;
    margin-bottom:20px;
}

.price-box{
    display:flex;
    align-items:end;
    gap:12px;
    margin-bottom:30px;
}

.price{
    color:#0d6efd;
    font-size:48px;
    font-weight:700;
}

.price-box span{
    font-size:18px;
    color:#777;
    margin-bottom:8px;
}

.fleet-features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
    margin-bottom:35px;
}


.car-tag{
    position:absolute;
    top:20px;
    left:20px;
    background:#0d6efd;
    color:#fff;
    padding:8px 18px;
    border-radius:30px;
    font-size:13px;
}

.car-bg{
    width:450px;
    height:450px;
    background:#0d6efd10;
    border-radius:50%;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    z-index:-1;
}

.fleet-table{
    border-radius:15px;
    overflow:hidden;
    box-shadow:0 8px 25px rgba(0,0,0,.05);
}


.thank-you-section{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:80px 0;
    background:#ffffff;
}

/* Illustration */

.illustration{
    max-width:520px;
    width:100%;
}

/* Heading */

.title{
    font-size:72px;
    font-weight:800;
    color:#000;
    margin-bottom:25px;
    line-height:1.1;
}

/* Paragraph */



/* Button */

.home-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--primary);
    color:#fff;
    padding:16px 34px;
    border-radius:10px;
    text-decoration:none;
    font-size:20px;
    font-weight:600;
    transition:.3s;
}

.home-btn:hover{
    background:var(--accent);
    color:#fff;
    transform:translateY(-3px);
}

.home-btn i{
    font-size:22px;
}

/* Decorative Dots */

.dot{
    position:absolute;
    width:14px;
    height:14px;
    background:var(--secondary);
    border-radius:50%;
}

.dot1{
    top:90px;
    left:100px;
}

.dot2{
    bottom:120px;
    left:230px;
}

.dot3{
    right:180px;
    top:120px;
}

.dot4{
    bottom:80px;
    right:300px;
}

/* Decorative Cross */

.cross{
    position:absolute;
    width:18px;
    height:18px;
}

.cross::before,
.cross::after{
    content:"";
    position:absolute;
    background:#444;
}

.cross::before{
    width:2px;
    height:18px;
    left:8px;
}

.cross::after{
    width:18px;
    height:2px;
    top:8px;
}

.cross{
    transform:rotate(45deg);
}

.cross1{
    top:220px;
    left:48%;
}

.cross2{
    bottom:120px;
    left:42%;
}

/* Responsive */

@media(max-width:1200px){

.title{
    font-size:58px;
}

.subtitle{
    font-size:24px;
}

}

@media(max-width:991px){

.thank-you-section{
    text-align:center;
    padding:60px 20px;
}

.title{
    font-size:52px;
}

.subtitle{
    font-size:22px;
}

.illustration{
    max-width:430px;
}

}

@media(max-width:576px){

.title{
    font-size:40px;
}

.subtitle{
    font-size:18px;
}

.home-btn{
    font-size:17px;
    padding:14px 28px;
}

.dot,
.cross{
    display:none;
}

}

.contact-box a {
    color: white;
    text-decoration: none;
}
.contact-box a:hover {
    color: var(--accent);
    text-decoration: underline;
}

.whatsapp-float {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 65px;
    height: 65px;
    background: #25D366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 36px;
    box-shadow: 0 8px 20px rgba(0,0,0,.25);
    z-index: 9999;
    transition: all .3s ease;
    animation: whatsappPulse 2s infinite;
}

.whatsapp-float:hover {
    background: #1ebe5d;
    color: #fff;
    transform: scale(1.1);
}

@keyframes whatsappPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(37,211,102,.7);
    }
    70% {
        box-shadow: 0 0 0 18px rgba(37,211,102,0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(37,211,102,0);
    }
}

@media (max-width: 768px) {
    .whatsapp-float {
        width: 58px;
        height: 58px;
        right: 15px;
        bottom: 15px;
        font-size: 32px;
    }
}
.car-image-1 {
    bottom: 100px;
}