/* ===================================
   RENTAL CARS SECTION
=================================== */

.rt-rental-cars{

    padding:90px 0;

    background:#ffffff;

}

.rt-rental-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    margin-top:30px;

}

.rt-rental-card{
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    transition:0.3s ease;
}

.rt-rental-card:hover{
    transform:translateY(-5px);
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.rt-rental-card{

    background:#fff;

    border:1px solid #eeeeee;

    border-radius:18px;

    overflow:hidden;

    transition:.35s;

}

.rt-rental-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 40px rgba(0,0,0,.08);

}

.rt-rental-image{

    width:100%;

    height:220px;

    overflow:hidden;

    position:relative;

}

.rt-rental-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

    border-radius:18px 18px 0 0;

}

.rt-rental-content{

     padding:20px;

    display:flex;

    flex-direction:column;

    min-height:220px;

}

.rt-rental-content h3{

   font-size:18px;

    font-weight:700;

    line-height:1.35;

    margin:0 0 12px;

    min-height:50px;


}

.rt-rental-specs{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

    font-size:14px;

    color:#666;

    margin-bottom:18px;

}

.rt-rental-price{

    font-size:15px;

    color:#666;

    padding-bottom:18px;


}

.rt-rental-price small{

    display:block;

    margin-bottom:6px;

}

.rt-rental-price strong{

    display:block;

    font-size:18px;

    font-weight:700;

    color:#111;

}
.rt-book-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:130px;

    height:44px;

    margin-top:16px;

    border:2px solid #e60012;

    border-radius:10px;

    background:#fff;

    color:#e60012;

    font-size:16px;

    font-weight:600;

    text-decoration:none;

    transition:.3s ease;

}

.rt-book-btn:hover{

    background:#e60012;

    color:#fff;

}
/* =========================
RENTAL GRID - DESKTOP
========================= */

.rt-rental-row{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    width: 100%;
}


/* =========================
LAPTOP
========================= */

@media (max-width:1200px){
    .rt-rental-row{
        grid-template-columns: repeat(3, 1fr);
    }
}


/* =========================
TABLET
========================= */

@media (max-width:992px){
    .rt-rental-row{
        grid-template-columns: repeat(2, 1fr);
    }
}


/* =========================
MOBILE (HORIZONTAL SCROLL)
========================= */

@media (max-width:576px){

    .rt-rental-row{
        display: flex;              /* override grid */
        overflow-x: auto;
        gap: 12px;
        padding: 10px 15px;

        scroll-snap-type: x mandatory;
    }

    .rt-rental-row::-webkit-scrollbar{
        display: none;
    }

    .rt-rental-card{
        min-width: 260px;           /* FIXED SIZE (important) */
        max-width: 260px;

        flex: 0 0 auto;
        scroll-snap-align: start;
    }
}


/* =========================
BADGE
========================= */

.rt-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #e60012;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 6px;
    z-index: 2;
    box-shadow: 0 2px 8px rgba(230,0,18,0.35);
}


/* =========================
CARD DESIGN
========================= */

.rt-rental-card{
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    transition: 0.3s ease;
}

.rt-rental-card:hover{
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}


/* =========================
IMAGE FIX
========================= */

.rt-rental-image img{
    width: 100%;
    display: block;
    transition: 0.3s ease;
}

.rt-rental-card:hover .rt-rental-image img{
    transform: scale(1.05);
}