/*==============================
        GOOGLE FONT
================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');



/*==============================
        ROOT VARIABLES
================================*/


:root{

    --primary:#ff0000;

    --secondary:#000000;

    --dark:#000000;

    --light:#ffffff;

    --gray:#000000;

    --background:#000000;

    --border:#ff0000;

    --shadow:0 20px 40px rgba(0,0,0,.12);

    --transition:.4s ease;

}





/*==============================
        RESET
================================*/


*{

    margin:0;

    padding:0;

    box-sizing:border-box;

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

    scroll-behavior:smooth;

}



html{

    overflow-x:hidden;

}



body{

    background:var(--background);

    color:#ffffff;

}



img{

    max-width:100%;

    display:block;

}



a{

    text-decoration:none;

    color:inherit;

}



ul{

    list-style:none;

}



.container{

    width:90%;

    max-width:1200px;

    margin:auto;

}






/*==============================
        BUTTONS
================================*/


.btn{


    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:15px 32px;

    border-radius:50px;

    font-size:15px;

    font-weight:600;

    transition:var(--transition);

    cursor:pointer;

    border:none;

}



.book-btn{

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

    min-width:150px;
    height:54px;

    padding:0 28px;

    border-radius:999px;

    white-space:nowrap;

    font-size:17px;

    font-weight:700;

}



.btn-primary:hover{


    background:#3acc00;

    transform:translateY(-5px);

    box-shadow:0 15px 30px rgba(0,102,255,.3);

}



.btn-secondary{


    border:2px solid white;

    color:rgb(255, 255, 255);

    background:transparent;

}



.btn-secondary:hover{


    background:white;

    color:var(--dark);

}



.full{

    width:100%;

}







/*==============================
        HEADER
================================*/


.header{


    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:1000;

    padding:25px 0;

    transition:.4s;

}



.header .container{


    display:flex;

    align-items:center;

    justify-content:space-between;

}



.logo{


    display:flex;

    align-items:center;

    gap:10px;

    color:rgb(255, 255, 255);

    font-size:28px;

    font-weight:700;

}



.logo i{


    color:var(--primary);

}





.navbar ul{


    display:flex;

    gap:35px;

}



.navbar a{


    color:rgb(255, 255, 255);

    font-size:15px;

    font-weight:500;

    transition:.3s;

}



.navbar a:hover{


    color:var(--primary);

}





.header-buttons{


    display:flex;

    align-items:center;

    gap:20px;

}



.menu-btn{


    display:none;

    color:white;

    font-size:25px;

}








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


.hero{


    min-height:100vh;

    position:relative;

    display:flex;

    align-items:center;

    padding:150px 8% 80px;

    background:

    linear-gradient(

        rgba(255, 0, 0, 0.65),

        rgba(0,0,0,.65)

    ),

    url("../img/hero.jpg");

    background-size:cover;

    background-position:center;

}




.hero-content{


    max-width:650px;

    color:rgb(255, 255, 255);

    position:relative;

    z-index:2;

}



.hero-tag{


    display:inline-block;

    background:rgb(255, 0, 0);

    backdrop-filter:blur(10px);

    padding:8px 20px;

    border-radius:30px;

    font-size:13px;

    letter-spacing:2px;

    margin-bottom:20px;

}



.hero h1{


    font-size:65px;

    line-height:1.1;

    font-weight:800;

    margin-bottom:25px;

}



.hero p{


    color:#dddddd;

    font-size:18px;

    line-height:1.8;

    margin-bottom:35px;

}



.hero-buttons{


    display:flex;

    gap:20px;

}







/*==============================
        RESERVATION CARD
================================*/


.hero-card{


    position:absolute;

    right:8%;

    bottom:12%;

    background:white;

    width:380px;

    padding:35px;

    border-radius:20px;

    box-shadow:var(--shadow);

    z-index:3;

}



.hero-card h3{


    font-size:25px;

    margin-bottom:25px;

}



.input-box{


    margin-bottom:18px;

}



.input-box label{


    display:block;

    font-size:13px;

    color:var(--gray);

    margin-bottom:8px;

}



.input-box input,

.input-box select{


    width:100%;

    padding:14px;

    border:1px solid var(--border);

    border-radius:10px;

    outline:none;

}



.double-input{


    display:grid;

    grid-template-columns:1fr 1fr;

    gap:15px;

}







/*==============================
        FEATURES
================================*/


.features{


    margin-top:-60px;

    position:relative;

    z-index:5;

}



.features .container{


    background:white;

    padding:40px;

    border-radius:20px;

    box-shadow:var(--shadow);

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}



.feature-box{


    text-align:center;

}



.feature-box i{


    font-size:35px;

    color:var(--primary);

    margin-bottom:15px;

}



.feature-box h3{


    margin-bottom:10px;

}



.feature-box p{


    color:var(--gray);

    font-size:14px;

}






/*==============================
        ABOUT
================================*/


.about{


    padding:120px 0;

}



.about .container{


    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}



.about-image img{


    border-radius:25px;

    box-shadow:var(--shadow);

}



.about-content span{


    color:var(--primary);                   

    font-weight:700;

    letter-spacing:2px;

}



.about-content h2{


    font-size:45px;

    line-height:1.2;

    margin:20px 0;

}



.about-content p{


    color:var(--gray);

    line-height:1.8;

    margin-bottom:30px;

}



.stats{


    display:flex;

    gap:35px;

    margin-bottom:35px;

}



.stats h3{


    font-size:35px;

    color:var(--primary);

}



.stats p{


    margin:0;

    font-size:14px;

}
/*==============================
        SECTION TITLES
================================*/


.section-title{

    text-align:center;

    max-width:700px;

    margin:0 auto 60px;

}


.section-title span{

    color:var(--primary);

    font-size:14px;

    font-weight:700;

    letter-spacing:2px;

}


.section-title h2{

    font-size:45px;

    margin:15px 0;

    color:var(--dark);

}


.section-title p{

    color:var(--gray);

    line-height:1.7;

}





/*==============================
        FLEET
================================*/


.fleet{

    padding:100px 0;

    background:rgb(255, 255, 255);

}



.fleet-grid{


    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}



.car-card{


    background:rgba(255, 0, 0, 0.584);

    border-radius:20px;

    overflow:hidden;

    box-shadow:var(--shadow);

    transition:.4s;

}



.car-card:hover{


    transform:translateY(-10px);

}



.car-image{


    height:230px;

    position:relative;

    overflow:hidden;

}



.car-image img{


    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}



.car-card:hover img{


    transform:scale(1.1);

}



.category{


    position:absolute;

    top:20px;

    left:20px;

    background:var(--gray);

    color:rgb(255, 255, 255);

    padding:7px 18px;

    border-radius:30px;

    font-size:12px;

}



.car-info{


    padding:25px;

}



.car-info h3{


    font-size:22px;

    margin-bottom:10px;

}



.car-info p{


    color:var(--light);

    font-size:14px;

    line-height:1.6;

}



.car-info ul{


    margin:20px 0;

}



.car-info li{


    display:flex;

    align-items:center;

    gap:10px;

    color:#ffffff;

    font-size:14px;

    margin:10px 0;

}



.car-info li i{


    color:var(--light);

}



.price{


    display:flex;

    justify-content:space-between;

    align-items:center;

    border-top:1px solid var(--border);

    padding-top:20px;

}



.price h4{


    font-size:25px;

}



.price span{


    font-size:14px;

    color:var(--light);

}



.btn-small{


    background:var(--primary);

    color:white;

    padding:10px 18px;

    border-radius:30px;

    font-size:13px;

    font-weight:600;

}



.center-btn{


    text-align:center;

    margin-top:50px;

}








/*==============================
        SERVICES
================================*/


.services{


    padding:100px 0;

    background:#7f7f7f;

}



.services-grid{


    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}



.service-card{


    background:white;

    padding:40px 25px;

    border-radius:20px;

    text-align:center;

    transition:.4s;

}



.service-card:hover{


    transform:translateY(-10px);

    box-shadow:var(--shadow);

}



.service-card i{


    font-size:40px;

    color:var(--primary);

    margin-bottom:20px;

}



.service-card h3{


    margin-bottom:15px;

}



.service-card p{


    color:var(--gray);

    font-size:14px;

    line-height:1.7;

}







/*==============================
        PROMOTION
================================*/


.promotion{


    min-height:450px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    background:

    linear-gradient(

        rgba(0,0,0,.65),

        rgba(255, 0, 0, 0.65)

    ),

    url("../img/promotion.jpg");

    background-size:cover;

    background-position:center;

    color:white;

}



.promotion-content{


    max-width:700px;

}



.promotion span{


    color:#ddd;

    letter-spacing:3px;

}



.promotion h2{


    font-size:50px;

    margin:20px 0;

}



.promotion p{


    margin-bottom:30px;

}







/*==============================
        GALLERY
================================*/


.gallery{


    padding:100px 0;

}



.gallery-grid{


    width:90%;

    max-width:1200px;

    margin:auto;

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:20px;

}



.gallery-item{


    height:300px;

    overflow:hidden;

    position:relative;

    border-radius:20px;

}



.gallery-item img{


    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}



.gallery-item:hover img{


    transform:scale(1.1);

}



.gallery-overlay{


    position:absolute;

    bottom:0;

    left:0;

    width:100%;

    padding:25px;

    color:white;

    background:

    linear-gradient(

        transparent,

        rgba(255, 0, 0, 0.8)

    );

}



.gallery-overlay h3{


    font-size:22px;

}







/*==============================
        TESTIMONIALS
================================*/


.testimonials{


    padding:100px 0;

    background:rgb(255, 255, 255);

}



.testimonial-grid{


    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}



.testimonial-card{


    background:#f8fafc;

    padding:35px;

    border-radius:20px;

}



.client{


    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:20px;

}



.client img{


    width:60px;

    height:60px;

    border-radius:50%;

    object-fit:cover;

}



.client span{


    color:var(--gray);

    font-size:13px;

}



.testimonial-card p{


    color:#555;

    line-height:1.8;

}



.stars{


    margin-top:20px;

    color:#ffc107;

}
/*==============================
        FAQ
================================*/


.faq{

    padding:100px 0;

    background:#f8fafc;

}



.faq-container{

    max-width:850px;

}



.faq details{


    background:white;

    margin-bottom:20px;

    padding:25px 30px;

    border-radius:15px;

    box-shadow:0 10px 25px rgba(0,0,0,.05);

    cursor:pointer;

}



.faq summary{


    font-size:18px;

    font-weight:600;

    color:var(--dark);

}



.faq p{


    margin-top:20px;

    color:var(--gray);

    line-height:1.7;

}







/*==============================
        BOOKING
================================*/


.booking{


    padding:100px 0;

    background:white;

}



.booking-form{


    max-width:900px;

    margin:auto;

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

}



.booking-form input,

.booking-form select,

.booking-form textarea{


    width:100%;

    padding:16px;

    border:1px solid var(--border);

    border-radius:12px;

    outline:none;

    font-size:15px;

}



.booking-form textarea{


    grid-column:span 2;

    height:150px;

    resize:none;

}



.booking-form button{


    grid-column:span 2;

    justify-self:center;

}







/*==============================
        CONTACT
================================*/


.contact{


    padding:100px 0;

    background:var(--dark);

    color:white;

}



.contact-grid{


    display:grid;

    grid-template-columns:2fr 1fr;

    gap:50px;

    align-items:center;

}



.contact span{


    color:var(--primary);

    letter-spacing:2px;

    font-weight:700;

}



.contact h2{


    font-size:45px;

    margin:20px 0;

}



.contact p{


    color:#ccc;

    margin:15px 0;

}



.contact p i{


    color:var(--primary);

    margin-right:10px;

}



.social-box{


    text-align:center;

}



.social-box h3{


    margin-bottom:25px;

}



.social-box a{


    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:50px;

    height:50px;

    margin:5px;

    background:white;

    color:var(--dark);

    border-radius:50%;

    font-size:22px;

    transition:.3s;

}



.social-box a:hover{


    background:var(--primary);

    color:white;

    transform:translateY(-5px);

}







/*==============================
        FOOTER
================================*/


.footer{


    background:#050b16;

    color:white;

    padding:70px 0 20px;

}



.footer-grid{


    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:40px;

}



.footer h2{


    font-size:35px;

}



.footer h3{


    margin-bottom:20px;

}



.footer a{


    display:block;

    color:#aaa;

    margin:10px 0;

    transition:.3s;

}



.footer a:hover{


    color:white;

}



.copyright{


    margin-top:50px;

    padding-top:20px;

    text-align:center;

    border-top:1px solid rgba(255,255,255,.1);

    color:#aaa;

}








/*==============================
        WHATSAPP BUTTON
================================*/


.whatsapp{


    position:fixed;

    bottom:30px;

    right:30px;

    width:60px;

    height:60px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#25d366;

    color:white;

    border-radius:50%;

    font-size:30px;

    z-index:999;

    box-shadow:0 10px 30px rgba(0,0,0,.2);

    transition:.3s;

}



.whatsapp:hover{


    transform:scale(1.1);

}







/*==============================
        ANIMATIONS
================================*/


@keyframes fadeUp{


    from{

        opacity:0;

        transform:translateY(40px);

    }


    to{

        opacity:1;

        transform:translateY(0);

    }


}



.hero-content{


    animation:fadeUp 1s ease;

}








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


@media(max-width:1100px){



    .hero h1{

        font-size:50px;

    }


    .hero-card{

        position:relative;

        right:auto;

        bottom:auto;

        margin-top:40px;

    }


    .hero{

        flex-direction:column;

        align-items:flex-start;

    }



    .features .container{

        grid-template-columns:repeat(2,1fr);

    }



    .fleet-grid,

    .services-grid{

        grid-template-columns:repeat(2,1fr);

    }



}






@media(max-width:768px){



    .navbar{

        display:none;

    }



    .menu-btn{

        display:block;

    }



    .header-buttons .btn{

        display:none;

    }



    .hero h1{

        font-size:38px;

    }



    .hero p{

        font-size:15px;

    }



    .hero-buttons{

        flex-direction:column;

    }



    .hero-card{

        width:100%;

    }



    .features .container,

    .about .container,

    .contact-grid,

    .footer-grid,

    .testimonial-grid,

    .fleet-grid,

    .services-grid,

    .gallery-grid{


        grid-template-columns:1fr;

    }



    .about-content h2,

    .section-title h2,

    .contact h2{


        font-size:32px;

    }



    .stats{


        flex-direction:column;

    }



    .gallery-item{

        height:250px;

    }



    .booking-form{


        grid-template-columns:1fr;

    }



    .booking-form textarea,

    .booking-form button{

        grid-column:auto;

    }


}







@media(max-width:450px){


    .hero{

        padding:120px 5% 60px;

    }



    .btn{

        width:100%;

    }


}
/*==============================
        BACK TO TOP
================================*/


.back-top{

    position:fixed;

    bottom:100px;

    right:30px;

    width:50px;

    height:50px;

    background:#0066ff;

    color:white;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    cursor:pointer;

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:999;

}



.back-top.show{

    opacity:1;

    visibility:visible;

}



/* MOBILE MENU */


@media(max-width:768px){


.navbar.active{


    display:block;

    position:absolute;

    top:80px;

    left:0;

    width:100%;

    background:#08101f;

    padding:30px;

}



.navbar.active ul{


    flex-direction:column;

    gap:20px;

}



}

/*========== PAGE BANNER ==========*/

.page-banner{

    background:#08101f;

    color:white;

    padding:150px 0 80px;

    text-align:center;

}

.page-banner h1{

    font-size:48px;

    margin-bottom:15px;

}

.page-banner p{

    font-size:18px;

    color:#cbd5e1;

}
/* VEHICLE IMAGE SLIDER */

.car-slider{
    position:relative;
    height:250px;
    overflow:hidden;
}

.car-slide{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:0;
    transition:opacity .4s ease;
}

.car-slide.active{
    opacity:1;
}

.slider-btn{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,.55);
    color:white;
    cursor:pointer;
    z-index:3;
}

.prev-btn{
    left:15px;
}

.next-btn{
    right:15px;
}

.slider-btn:hover{
    background:var(--primary);
}

.car-slider .category{
    z-index:4;
}
/*==============================
    MODERN VEHICLE CARD
================================*/

.modern-card{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:#ffffff;
    box-shadow:0 25px 60px rgba(8,16,31,.14);
    transition:transform .4s ease, box-shadow .4s ease;
}

.modern-card:hover{
    transform:translateY(-12px);
    box-shadow:0 35px 80px rgba(8,16,31,.22);
}

.modern-card .car-slider{
    height:320px;
    background:#eef2f7;
}

.modern-card .car-slide{
    object-fit:cover;
}

.modern-card .category{
    top:20px;
    left:20px;
    padding:8px 18px;
    font-weight:700;
    letter-spacing:.5px;
}

.car-badge{
    position:absolute;
    top:20px;
    right:20px;
    z-index:4;
    background:#ffffff;
    color:#08101f;
    padding:8px 16px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.modern-card .car-info{
    padding:28px;
}

.car-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
}

.car-top h3{
    font-size:26px;
    margin-bottom:8px;
}

.car-subtitle{
    color:var(--gray);
    line-height:1.6;
    margin:0;
}

.rating{
    display:flex;
    align-items:center;
    gap:7px;
    background:#fff8dc;
    color:#111827;
    padding:8px 12px;
    border-radius:20px;
    font-weight:700;
    white-space:nowrap;
}

.rating i{
    color:#ffc107;
}

.car-features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin:28px 0;
}

.car-features div{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:85px;
    padding:12px;
    border:1px solid var(--border);
    border-radius:16px;
    background:#f8fafc;
    text-align:center;
    color:#111827;
}

.car-features i{
    color:var(--primary);
    font-size:21px;
    margin-bottom:8px;
}

.car-features span{
    font-size:13px;
    font-weight:600;
    color:#374151;
}

.car-bottom{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    padding-top:24px;
    border-top:1px solid var(--border);
}

.modern-price span{
    display:block;
    color:var(--gray);
    font-size:13px;
    margin-bottom:3px;
}

.modern-price h4{
    font-size:30px;
    color:var(--dark);
}

.modern-price small{
    font-size:14px;
    color:var(--gray);
    font-weight:500;
}

.car-actions{
    display:flex;
    gap:10px;
    align-items:center;
}

.reserve-btn{
    border:none;
}

.details-btn{
    border:1px solid var(--border);
    background:#ffffff;
    color:var(--dark);
    padding:11px 17px;
    border-radius:30px;
    font-weight:600;
    cursor:pointer;
    transition:.3s ease;
}

.details-btn:hover{
    background:var(--dark);
    color:#ffffff;
    border-color:var(--dark);
}

.modern-card .slider-btn{
    opacity:0;
    transition:.3s ease;
}

.modern-card:hover .slider-btn{
    opacity:1;
}

@media(max-width:768px){

    .modern-card .car-slider{
        height:260px;
    }

    .car-top{
        flex-direction:column;
    }

    .car-features{
        grid-template-columns:repeat(2,1fr);
    }

    .car-bottom{
        flex-direction:column;
        align-items:stretch;
    }

    .car-actions{
        flex-direction:column;
    }

    .car-actions a,
    .car-actions button{
        width:100%;
        text-align:center;
    }

}
/* CATÁLOGO DE LA PÁGINA VEHÍCULOS */

.vehicles-grid{

    display:grid;

    grid-template-columns:repeat(3,minmax(430px,1fr));

    gap:35px;

    align-items:start;

}

.vehicles-grid .modern-card{

    width:100%;

    min-width:430px;

}

.vehicles-grid .car-info{
    min-height:auto;
}

.vehicles-grid .car-top{
    min-height:auto;
}

.vehicles-grid .car-actions{
    flex-shrink:0;
}

@media(max-width:600px){

    .vehicles-grid{
        grid-template-columns:1fr;
    }

}
/* CORRECCIÓN DE TEXTO EN TARJETA */

.modern-card .car-top h3{
    color:#08101f;
    display:block;
}

.modern-card .car-subtitle{
    color:#6b7280;
    display:block;
}

.modern-card .car-info{
    color:#08101f;
}

.modern-card .car-top{
    position:relative;
    z-index:2;
} 
/* VEHICLE SEARCH AND FILTERS */

.vehicle-tools{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:25px;
    margin-bottom:45px;
}

#vehicle-search{
    width:100%;
    max-width:520px;
    padding:16px 22px;
    border:1px solid var(--border);
    border-radius:50px;
    font-size:15px;
    outline:none;
    box-shadow:0 10px 30px rgba(8,16,31,.06);
}

#vehicle-search:focus{
    border-color:var(--primary);
}

.vehicle-filters{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
}

.vehicle-filter{
    border:1px solid var(--border);
    background:white;
    color:var(--dark);
    padding:11px 22px;
    border-radius:40px;
    font-weight:600;
    cursor:pointer;
    transition:.3s;
}

.vehicle-filter:hover,
.vehicle-filter.active{
    background:var(--primary);
    color:white;
    border-color:var(--primary);
}

.modern-card.vehicle-hidden{
    display:none;
}
#vehicle-sort{
    width:100%;
    max-width:260px;
    padding:13px 18px;
    border:1px solid var(--border);
    border-radius:40px;
    background:white;
    color:var(--dark);
    font-weight:600;
    outline:none;
    cursor:pointer;
}
/*==================================
    PREMIUM VEHICLE DETAILS PAGE
==================================*/

.vehicle-showcase{
    padding:70px 0 110px;
    background:
        radial-gradient(
            circle at top right,
            rgba(0,102,255,.08),
            transparent 30%
        ),
        #f6f8fc;
}

.vehicle-breadcrumb{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:30px;
    color:#6b7280;
    font-size:14px;
}

.vehicle-breadcrumb a{
    transition:.3s ease;
}

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

.vehicle-breadcrumb i{
    font-size:10px;
}

.showcase-grid{
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(420px,.75fr);
    gap:50px;
    align-items:start;
}


/* GALERÍA */

.showcase-gallery{
    position:sticky;
    top:110px;
}

.main-image-container{
    position:relative;
    height:570px;
    overflow:hidden;
    border-radius:28px;
    background:#e9edf4;
    box-shadow:0 30px 70px rgba(8,16,31,.16);
}

.main-image-container > img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
        opacity .25s ease,
        transform .8s ease;
}

.main-image-container:hover > img{
    transform:scale(1.025);
}

.vehicle-status,
.vehicle-type{
    position:absolute;
    top:24px;
    z-index:3;
    padding:9px 18px;
    border-radius:40px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.8px;
}

.vehicle-status{
    left:24px;
    background:#22c55e;
    color:white;
}

.vehicle-type{
    left:135px;
    background:rgba(8,16,31,.86);
    color:white;
    backdrop-filter:blur(10px);
}

.favorite-button{
    position:absolute;
    top:22px;
    right:22px;
    z-index:3;
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.92);
    color:#08101f;
    font-size:20px;
    cursor:pointer;
    box-shadow:0 12px 30px rgba(0,0,0,.16);
    transition:.3s ease;
}

.favorite-button:hover{
    color:#ef4444;
    transform:scale(1.08);
}

.favorite-button.active{
    background:#ef4444;
    color:white;
}

.vehicle-thumbnails{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:18px;
}

.thumbnail-button{
    height:125px;
    padding:0;
    overflow:hidden;
    border:3px solid transparent;
    border-radius:17px;
    background:white;
    cursor:pointer;
    opacity:.72;
    transition:.3s ease;
}

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

.thumbnail-button:hover,
.thumbnail-button.active{
    border-color:var(--primary);
    opacity:1;
    transform:translateY(-3px);
}


/* INFORMACIÓN */

.showcase-information{
    padding:42px;
    border:1px solid rgba(229,231,235,.9);
    border-radius:28px;
    background:rgba(255,255,255,.94);
    box-shadow:0 30px 70px rgba(8,16,31,.12);
    backdrop-filter:blur(18px);
}

.vehicle-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:25px;
    padding-bottom:26px;
    border-bottom:1px solid var(--border);
}

.vehicle-brand{
    display:block;
    margin-bottom:7px;
    color:var(--primary);
    font-size:13px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:2px;
}

.vehicle-heading h1{
    color:var(--dark);
    font-size:42px;
    line-height:1.14;
}

.vehicle-rating{
    display:grid;
    grid-template-columns:auto auto;
    align-items:center;
    gap:3px 7px;
    flex-shrink:0;
    padding:11px 14px;
    border-radius:16px;
    background:#fff8dd;
}

.vehicle-rating i{
    color:#fbbf24;
}

.vehicle-rating strong{
    color:#111827;
}

.vehicle-rating span{
    grid-column:1 / -1;
    color:#6b7280;
    font-size:11px;
}

.vehicle-description{
    margin:27px 0;
    color:#64748b;
    line-height:1.85;
}


/* ESPECIFICACIONES */

.vehicle-specifications{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
}

.specification-item{
    display:flex;
    align-items:center;
    gap:14px;
    min-height:78px;
    padding:15px;
    border:1px solid var(--border);
    border-radius:17px;
    background:#f8fafc;
    transition:.3s ease;
}

.specification-item:hover{
    border-color:rgba(0,102,255,.32);
    background:#f1f6ff;
    transform:translateY(-3px);
}

.specification-item > i{
    width:43px;
    height:43px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    border-radius:13px;
    background:rgba(0,102,255,.1);
    color:var(--primary);
    font-size:18px;
}

.specification-item span{
    display:block;
    color:#94a3b8;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.6px;
}

.specification-item strong{
    display:block;
    margin-top:3px;
    color:#334155;
    font-size:13px;
}


/* INCLUYE */

.vehicle-includes{
    margin-top:30px;
    padding:25px;
    border-radius:20px;
    background:#08101f;
    color:white;
}

.vehicle-includes h3{
    margin-bottom:18px;
    font-size:18px;
}

.includes-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
}

.includes-grid span{
    display:flex;
    align-items:center;
    gap:9px;
    color:#d5deea;
    font-size:13px;
}

.includes-grid i{
    color:#22c55e;
}


/* PRECIO Y BOTONES */

.vehicle-booking-card{
    margin-top:28px;
    padding-top:28px;
    border-top:1px solid var(--border);
}

.booking-price > span{
    color:#94a3b8;
    font-size:13px;
}

.booking-price h2{
    margin:4px 0;
    color:var(--primary);
    font-size:39px;
}

.booking-price small{
    color:#64748b;
    font-size:15px;
    font-weight:500;
}

.booking-price p{
    color:#94a3b8;
    font-size:12px;
}

.booking-actions{
    display:grid;
    gap:12px;
    margin-top:23px;
}

.vehicle-reserve-button,
.back-fleet-button{
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    border-radius:50px;
    font-weight:700;
    transition:.3s ease;
}

.vehicle-reserve-button{
    background:var(--primary);
    color:white;
    box-shadow:0 16px 30px rgba(0,102,255,.24);
}

.vehicle-reserve-button:hover{
    background:#004fd1;
    transform:translateY(-4px);
    box-shadow:0 22px 40px rgba(0,102,255,.32);
}

.back-fleet-button{
    border:1px solid var(--border);
    background:white;
    color:var(--dark);
}

.back-fleet-button:hover{
    border-color:var(--dark);
    background:var(--dark);
    color:white;
}


/* RESPONSIVE */

@media(max-width:1100px){

    .showcase-grid{
        grid-template-columns:1fr;
    }

    .showcase-gallery{
        position:relative;
        top:auto;
    }

    .main-image-container{
        height:520px;
    }

}

@media(max-width:700px){

    .vehicle-showcase{
        padding:50px 0 80px;
    }

    .main-image-container{
        height:330px;
        border-radius:20px;
    }

    .thumbnail-button{
        height:85px;
    }

    .showcase-information{
        padding:27px 22px;
    }

    .vehicle-heading{
        flex-direction:column;
    }

    .vehicle-heading h1{
        font-size:33px;
    }

    .vehicle-specifications,
    .includes-grid{
        grid-template-columns:1fr;
    }

    .vehicle-status,
    .vehicle-type{
        top:15px;
        padding:7px 12px;
        font-size:10px;
    }

    .vehicle-status{
        left:15px;
    }

    .vehicle-type{
        left:112px;
    }

    .favorite-button{
        top:13px;
        right:13px;
        width:42px;
        height:42px;
    }

}
/* VEHICLE EXTRA INFORMATION */

.vehicle-extra-info{
    padding:0 0 110px;
    background:#f6f8fc;
}

.extra-info-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}

.extra-card{
    padding:35px;
    border-radius:24px;
    background:white;
    box-shadow:0 20px 50px rgba(8,16,31,.08);
}

.extra-card h2{
    margin-bottom:25px;
    color:var(--dark);
    font-size:26px;
}

.equipment-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px;
}

.equipment-list span,
.requirements-list li{
    display:flex;
    align-items:center;
    gap:12px;
    color:#475569;
}

.equipment-list i{
    color:#22c55e;
}

.requirements-list{
    display:grid;
    gap:18px;
}

.requirements-list i{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:rgba(0,102,255,.1);
    color:var(--primary);
}

@media(max-width:800px){

    .extra-info-grid{
        grid-template-columns:1fr;
    }

    .equipment-list{
        grid-template-columns:1fr;
    }

}
/* RELATED VEHICLES */

.related-vehicles{
    padding:100px 0;
    background:white;
}

.related-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.related-card{
    overflow:hidden;
    border-radius:22px;
    background:#f8fafc;
    box-shadow:0 18px 45px rgba(8,16,31,.09);
    transition:.35s ease;
}

.related-card:hover{
    transform:translateY(-8px);
    box-shadow:0 28px 60px rgba(8,16,31,.15);
}

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

.related-info{
    padding:24px;
}

.related-info > span{
    color:var(--primary);
    font-size:12px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
}

.related-info h3{
    margin:10px 0 20px;
    color:var(--dark);
    font-size:22px;
}

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

.related-bottom strong{
    color:var(--dark);
    font-size:22px;
}

.related-bottom small{
    color:var(--gray);
    font-size:12px;
    font-weight:500;
}

.related-bottom a{
    padding:10px 16px;
    border-radius:30px;
    background:var(--primary);
    color:white;
    font-size:13px;
    font-weight:700;
}

@media(max-width:900px){

    .related-grid{
        grid-template-columns:1fr;
    }

}
/*==================================
        RESERVATION PAGE
==================================*/

.reservation-page{

    padding:90px 0;

    background:#f6f8fc;

}



.reservation-layout{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:40px;

    align-items:start;

}



.reservation-form-area{

    background:#fff;

    padding:40px;

    border-radius:25px;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}



.reservation-label{

    color:var(--primary);

    font-weight:700;

    letter-spacing:2px;

    font-size:13px;

}



.reservation-form-area h2{

    margin:15px 0;

    font-size:38px;

    color:var(--dark);

}



.reservation-form-area p{

    color:#666;

    margin-bottom:35px;

}



.premium-reservation-form{

    display:flex;

    flex-direction:column;

    gap:22px;

}



.form-row{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

}



.form-group{

    display:flex;

    flex-direction:column;

}



.form-group label{

    margin-bottom:8px;

    font-weight:600;

    color:#374151;

}



.form-group input,

.form-group select,

.form-group textarea{

    padding:16px;

    border:1px solid #d1d5db;

    border-radius:14px;

    font-size:15px;

    transition:.3s;

}



.form-group input:focus,

.form-group select:focus,

.form-group textarea:focus{

    outline:none;

    border-color:var(--primary);

}



textarea{

    resize:vertical;

    min-height:150px;

}



.reservation-submit{

    margin-top:15px;

    padding:18px;

    border:none;

    border-radius:50px;

    background:var(--primary);

    color:#fff;

    font-size:16px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}



.reservation-submit:hover{

    transform:translateY(-3px);

    background:#0052d4;

}



.reservation-summary{

    position:sticky;

    top:110px;

    background:#fff;

    padding:35px;

    border-radius:25px;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}



.summary-label{

    color:var(--primary);

    font-size:13px;

    letter-spacing:2px;

    font-weight:700;

}



.reservation-summary h2{

    margin:15px 0 30px;

    color:var(--dark);

}



.summary-vehicle{

    display:flex;

    gap:15px;

    margin-bottom:30px;

}



.summary-vehicle img{

    width:120px;

    height:85px;

    object-fit:cover;

    border-radius:15px;

}



.summary-vehicle span{

    color:var(--primary);

    font-size:12px;

    font-weight:700;

}



.summary-vehicle h3{

    margin:6px 0;

}



.summary-lines{

    display:flex;

    flex-direction:column;

    gap:15px;

    margin-bottom:30px;

}



.summary-lines div{

    display:flex;

    justify-content:space-between;

    border-bottom:1px solid #e5e7eb;

    padding-bottom:12px;

}



.summary-total{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin:30px 0;

}



.summary-total strong{

    color:var(--primary);

    font-size:28px;

}



.summary-note{

    color:#666;

    line-height:1.6;

}



@media(max-width:1000px){

    .reservation-layout{

        grid-template-columns:1fr;

    }

}



@media(max-width:700px){

    .form-row{

        grid-template-columns:1fr;

    }

}
/* BENEFITS */

.reservation-benefits{

    padding:90px 0;

    background:#f7f8fb;

}

.benefits-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.benefit-card{

    padding:35px;

    border-radius:22px;

    text-align:center;

    background:#f8fafc;

    transition:.35s;

}

.benefit-card:hover{

    transform:translateY(-8px);

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

}

.benefit-card i{

    font-size:42px;

    color:var(--primary);

    margin-bottom:20px;

}

.benefit-card h3{

    margin-bottom:15px;

    color:#172033;

    font-weight:700;

}

.benefit-card p{

    color:#5f6b7a;

    line-height:1.7;

}

@media(max-width:1000px){

    .benefits-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:700px){

    .benefits-grid{

        grid-template-columns:1fr;

    }

}
/*==================================
        PREMIUM GALLERY PAGE
==================================*/

.gallery-page{
    padding:90px 0 110px;
    background:#f6f8fc;
}

.gallery-controls{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:45px;
}

.gallery-filter{
    border:1px solid var(--border);
    background:white;
    color:var(--dark);
    padding:12px 24px;
    border-radius:40px;
    font-weight:700;
    cursor:pointer;
    transition:.3s ease;
}

.gallery-filter:hover,
.gallery-filter.active{
    background:var(--primary);
    color:white;
    border-color:var(--primary);
    transform:translateY(-2px);
}

.premium-gallery-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.premium-gallery-item{
    position:relative;
    height:320px;
    overflow:hidden;
    border-radius:24px;
    box-shadow:0 20px 50px rgba(8,16,31,.12);
}

.premium-gallery-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .7s ease;
}

.premium-gallery-item:hover img{
    transform:scale(1.05);
}

.premium-gallery-overlay{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:28px;
    color:white;
    background:
        linear-gradient(
            transparent 35%,
            rgba(8,16,31,.88)
        );
    opacity:0;
    transition:.35s ease;
}

.premium-gallery-item:hover .premium-gallery-overlay{
    opacity:1;
}

.premium-gallery-overlay span{
    color:#8ab4ff;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.premium-gallery-overlay h3{
    margin-top:8px;
    font-size:24px;
}

.open-gallery-image{
    position:absolute;
    top:22px;
    right:22px;
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.92);
    color:var(--dark);
    font-size:18px;
    cursor:pointer;
    transition:.3s ease;
}

.open-gallery-image:hover{
    background:var(--primary);
    color:white;
    transform:scale(1.08);
}

.premium-gallery-item.gallery-hidden{
    display:none;
}


/* LIGHTBOX */

.gallery-lightbox{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px;
    background:rgba(3,8,18,.92);
    opacity:0;
    visibility:hidden;
    z-index:5000;
    transition:.3s ease;
}

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

.gallery-lightbox img{
    max-width:90%;
    max-height:85vh;
    object-fit:contain;
    border-radius:18px;
    box-shadow:0 25px 80px rgba(0,0,0,.45);
}

.close-lightbox{
    position:absolute;
    top:25px;
    right:30px;
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:50%;
    background:white;
    color:var(--dark);
    font-size:24px;
    cursor:pointer;
}

@media(max-width:1000px){

    .premium-gallery-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:650px){

    .premium-gallery-grid{
        grid-template-columns:1fr;
    }

    .premium-gallery-item{
        height:280px;
    }

    .premium-gallery-overlay{
        opacity:1;
    }

}
/*==================================
        CONTACT PAGE
==================================*/

.contact-page{
    padding:90px 0;
    background:#f6f8fc;
}

.contact-page-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:45px;
    align-items:start;
}

.contact-information,
.contact-form-card{
    background:white;
    border-radius:26px;
    box-shadow:0 22px 55px rgba(8,16,31,.09);
}

.contact-information{
    padding:42px;
}

.contact-label{
    color:var(--primary);
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.contact-information h2{
    margin:14px 0 18px;
    color:var(--dark);
    font-size:40px;
    line-height:1.2;
}

.contact-intro{
    color:#64748b;
    line-height:1.8;
    margin-bottom:34px;
}

.contact-details{
    display:grid;
    gap:18px;
}

.contact-detail{
    display:flex;
    align-items:center;
    gap:16px;
    padding:18px;
    border:1px solid var(--border);
    border-radius:18px;
    background:#f8fafc;
    transition:.3s ease;
}

.contact-detail:hover{
    transform:translateY(-3px);
    border-color:rgba(0,102,255,.3);
}

.contact-detail > i{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    border-radius:14px;
    background:rgba(0,102,255,.1);
    color:var(--primary);
    font-size:20px;
}

.contact-detail span{
    display:block;
    margin-bottom:4px;
    color:#94a3b8;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.8px;
}

.contact-detail a,
.contact-detail p{
    color:#334155;
    font-weight:600;
}

.contact-socials{
    display:flex;
    gap:12px;
    margin-top:30px;
}

.contact-socials a{
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--dark);
    color:white;
    transition:.3s ease;
}

.contact-socials a:hover{
    background:var(--primary);
    transform:translateY(-4px);
}


/* FORMULARIO */

.contact-form-card{
    padding:42px;
}

.contact-form-card h2{
    color:var(--dark);
    font-size:34px;
    margin-bottom:10px;
}

.contact-form-card > p{
    color:#64748b;
    margin-bottom:32px;
}

.contact-form{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.contact-submit{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-height:56px;
    border:0;
    border-radius:50px;
    background:var(--primary);
    color:white;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    transition:.3s ease;
}

.contact-submit:hover{
    background:#004fd1;
    transform:translateY(-3px);
    box-shadow:0 18px 35px rgba(0,102,255,.25);
}


/* MAPA */

.contact-map{
    height:460px;
}

.contact-map iframe{
    width:100%;
    height:100%;
    border:0;
    display:block;
}


/* RESPONSIVE */

@media(max-width:950px){

    .contact-page-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:700px){

    .contact-information,
    .contact-form-card{
        padding:28px 22px;
    }

    .contact-information h2{
        font-size:32px;
    }

    .contact-form-card h2{
        font-size:30px;
    }

}
/*==================================
        PREMIUM FOOTER
==================================*/

.main-footer{
    padding-top:80px;
    background:#050b16;
    color:white;
}

.footer-top{
    display:grid;
    grid-template-columns:1.4fr repeat(3,1fr);
    gap:50px;
    padding-bottom:55px;
}

.footer-logo{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:22px;
    font-size:29px;
    font-weight:800;
}

.footer-logo i{
    color:var(--primary);
}

.footer-brand p{
    max-width:340px;
    color:#9ca8b8;
    line-height:1.8;
}

.footer-socials{
    display:flex;
    gap:12px;
    margin-top:25px;
}

.footer-socials a{
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    color:white;
    transition:.3s ease;
}

.footer-socials a:hover{
    border-color:var(--primary);
    background:var(--primary);
    transform:translateY(-4px);
}

.footer-column{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:13px;
}

.footer-column h3{
    margin-bottom:12px;
    font-size:18px;
}

.footer-column a,
.footer-column p{
    color:#9ca8b8;
    font-size:14px;
    transition:.3s ease;
}

.footer-column a:hover{
    color:white;
    transform:translateX(4px);
}

.footer-contact i{
    width:22px;
    color:var(--primary);
}

.footer-newsletter{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:35px;
    padding:32px 0;
    border-top:1px solid rgba(255,255,255,.1);
}

.footer-newsletter span{
    color:var(--primary);
    font-size:12px;
    font-weight:800;
    letter-spacing:1.5px;
}

.footer-newsletter h3{
    margin-top:7px;
    font-size:23px;
}

.newsletter-form{
    width:100%;
    max-width:470px;
    display:flex;
    padding:6px;
    border-radius:50px;
    background:white;
}

.newsletter-form input{
    flex:1;
    min-width:0;
    padding:13px 18px;
    border:0;
    border-radius:50px;
    outline:none;
}

.newsletter-form button{
    padding:13px 24px;
    border:0;
    border-radius:50px;
    background:var(--primary);
    color:white;
    font-weight:700;
    cursor:pointer;
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
}

.footer-bottom .container{
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
}

.footer-bottom p,
.footer-bottom a{
    color:#8290a3;
    font-size:13px;
}

.footer-bottom div div{
    display:flex;
    gap:22px;
}

.footer-bottom a:hover{
    color:white;
}

@media(max-width:1000px){

    .footer-top{
        grid-template-columns:repeat(2,1fr);
    }

    .footer-newsletter{
        flex-direction:column;
        align-items:flex-start;
    }

}

@media(max-width:650px){

    .footer-top{
        grid-template-columns:1fr;
    }

    .newsletter-form{
        flex-direction:column;
        border-radius:20px;
    }

    .newsletter-form input,
    .newsletter-form button{
        width:100%;
    }

    .footer-bottom .container{
        flex-direction:column;
        justify-content:center;
        padding:22px 0;
        text-align:center;
    }

    .footer-bottom div div{
        flex-wrap:wrap;
        justify-content:center;
    }

}
/* ACTIVE NAVIGATION LINK */

.navbar a.active{
    color:var(--primary);
}

.navbar a.active::after{
    width:100%;
}
.navbar a{
    position:relative;
}

.navbar a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-7px;
    width:0;
    height:2px;
    background:var(--primary);
    transition:.3s ease;
}
/*==================================
            ABOUT PAGE
==================================*/

.about-page{

    padding:90px 0;

    background:#f8fafc;

}

.about-page-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    align-items:center;

}

/* IMAGEN */

.about-page-image{

    position:relative;

}

.about-page-image img{

    width:100%;

    border-radius:28px;

    display:block;

    box-shadow:0 25px 60px rgba(8,16,31,.15);

}

.experience-box{

    position:absolute;

    right:-20px;

    bottom:35px;

    width:180px;

    padding:28px;

    text-align:center;

    border-radius:22px;

    background:var(--primary);

    color:white;

    box-shadow:0 18px 45px rgba(0,102,255,.28);

}

.experience-box strong{

    display:block;

    font-size:42px;

    font-weight:800;

}

.experience-box span{

    font-size:14px;

}

/* TEXTO */

.about-page-label{

    color:var(--primary);

    font-size:13px;

    letter-spacing:2px;

    font-weight:800;

}

.about-page-content h2{

    margin:15px 0 25px;

    font-size:44px;

    color:var(--dark);

    line-height:1.2;

}

.about-page-content p{

    color:#64748b;

    line-height:1.9;

    margin-bottom:18px;

}

/* VALORES */

.about-values{

    display:grid;

    gap:22px;

    margin-top:35px;

}

.about-values > div{

    display:flex;

    gap:18px;

    padding:22px;

    border-radius:20px;

    background:white;

    box-shadow:0 15px 35px rgba(8,16,31,.08);

    transition:.3s;

}

.about-values > div:hover{

    transform:translateY(-6px);

}

.about-values i{

    width:58px;

    height:58px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:16px;

    background:rgba(0,102,255,.1);

    color:var(--primary);

    font-size:22px;

    flex-shrink:0;

}

.about-values h3{

    margin-bottom:8px;

    color:var(--dark);

}

.about-values p{

    margin:0;

}

/* ESTADÍSTICAS */

.about-statistics{

    padding:90px 0;

    background:var(--dark);

}

.about-statistics-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}

.about-statistics-grid div{

    padding:35px;

    text-align:center;

    border-radius:20px;

    background:rgba(255,255,255,.05);

    transition:.3s;

}

.about-statistics-grid div:hover{

    background:var(--primary);

    transform:translateY(-8px);

}

.about-statistics-grid strong{

    display:block;

    color:white;

    font-size:42px;

    margin-bottom:10px;

}

.about-statistics-grid span{

    color:#d1d5db;

    font-size:15px;

}

/* RESPONSIVE */

@media(max-width:1000px){

    .about-page-grid{

        grid-template-columns:1fr;

    }

    .about-statistics-grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:700px){

    .about-page{

        padding:70px 0;

    }

    .about-page-content h2{

        font-size:34px;

    }

    .experience-box{

        position:relative;

        right:auto;

        bottom:auto;

        width:100%;

        margin-top:20px;

    }

    .about-statistics-grid{

        grid-template-columns:1fr;

    }

}
/*==================================
            SERVICES PAGE
==================================*/

.services-page{

    padding:90px 0;

    background:#f8fafc;

}



.services-page-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:50px;

}



/* TARJETAS */

.service-premium-card{

    position:relative;

    overflow:hidden;

    padding:40px 35px;

    border-radius:24px;

    background:white;

    box-shadow:0 20px 50px rgba(8,16,31,.08);

    transition:.35s ease;

}

.service-premium-card:hover{

    transform:translateY(-10px);

    box-shadow:0 30px 60px rgba(8,16,31,.14);

}



.service-premium-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:var(--primary);

}



.service-premium-card i{

    width:72px;

    height:72px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px;

    margin-bottom:30px;

    background:rgba(0,102,255,.08);

    color:var(--primary);

    font-size:28px;

    transition:.3s;

}



.service-premium-card:hover i{

    transform:rotate(-8deg) scale(1.08);

    background:var(--primary);

    color:white;

}



.service-premium-card h3{

    margin-bottom:18px;

    color:var(--dark);

    font-size:24px;

}



.service-premium-card p{

    color:#64748b;

    line-height:1.8;

    margin-bottom:28px;

}



.service-premium-card a{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:var(--primary);

    font-weight:700;

    transition:.3s;

}



.service-premium-card a:hover{

    gap:16px;

}



/* RESPONSIVE */

@media(max-width:1100px){

    .services-page-grid{

        grid-template-columns:repeat(2,1fr);

    }

}



@media(max-width:700px){

    .services-page{

        padding:70px 0;

    }

    .services-page-grid{

        grid-template-columns:1fr;

    }

}
/*==================================
    HERO MINI RESERVATION FIX
==================================*/

.hero-card{
    height:auto !important;
    min-height:430px;
    padding:32px !important;
    overflow:visible !important;
    background:#ffffff !important;
}

.hero-booking-form{
    display:flex !important;
    flex-direction:column;
    gap:18px;
    width:100%;
}

.hero-booking-form .input-box{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.hero-booking-form label{
    display:block !important;
    color:#111827 !important;
    font-size:14px;
    font-weight:700;
}

.hero-booking-form input,
.hero-booking-form select{
    display:block !important;
    width:100%;
    min-height:52px;
    padding:0 16px;
    border:1px solid #d7dde7 !important;
    border-radius:12px;
    outline:none;
    background:#f8fafc !important;
    color:#111827 !important;
    font-family:inherit;
    font-size:14px;
}

.hero-booking-form input::placeholder{
    color:#7b8798 !important;
}

.hero-booking-form input:focus,
.hero-booking-form select:focus{
    border-color:#ff1010 !important;
    background:#ffffff !important;
    box-shadow:0 0 0 4px rgba(255,16,16,.1);
}

.hero-booking-form .double-input{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.hero-booking-form button{
    width:100%;
    min-height:55px;
    margin-top:4px;
}

@media(max-width:600px){

    .hero-card{
        min-height:auto;
        padding:24px 20px !important;
    }

    .hero-booking-form .double-input{
        grid-template-columns:1fr;
    }

}
.hero-card h3{
    color:#111827;
}
/*=============================
    PREMIUM HERO CARD
=============================*/

.hero-card{

    width:100%;
    max-width:430px;

    background:#fff;

    border-radius:28px;

    padding:35px;

    box-shadow:0 25px 60px rgba(0,0,0,.12);

}

.hero-card-title{

    font-size:28px;

    font-weight:700;

    color:#111;

    margin-bottom:30px;

}

.hero-booking-form{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.hero-booking-form .input-box{

    display:flex;

    flex-direction:column;

    gap:8px;

}

.hero-booking-form label{

    font-weight:600;

    color:#222;

}

.hero-booking-form input,

.hero-booking-form select{

    width:100%;

    height:56px;

    border-radius:14px;

    border:1px solid #ddd;

    padding:0 18px;

    font-size:15px;

    transition:.3s;

}

.hero-booking-form input:focus,

.hero-booking-form select:focus{

    border-color:#ff2020;

    box-shadow:0 0 0 4px rgba(255,0,0,.08);

}

.hero-booking-form .double-input{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.hero-booking-form button{

    margin-top:10px;

    height:58px;

    border-radius:18px;

    font-size:18px;

    font-weight:700;

}

.hero-card small{

    text-align:center;

    color:#777;

    margin-top:10px;

}
/* HERO RESERVATION — CLEAN RESET */

.hero-card{
    width:100%;
    max-width:430px;
    height:auto !important;
    min-height:0 !important;
    padding:34px !important;
    margin:0 !important;
    position:relative;
    overflow:visible !important;
    background:#fff !important;
    border-radius:28px;
    box-shadow:0 25px 60px rgba(0,0,0,.16);
}

.hero-card-title{
    display:block !important;
    margin:0 0 28px !important;
    color:#111827 !important;
    font-size:28px;
    line-height:1.2;
    font-weight:800;
}

.hero-booking-form{
    display:flex !important;
    flex-direction:column !important;
    gap:18px;
    width:100%;
    position:static !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
}

.hero-booking-form .input-box{
    display:flex !important;
    flex-direction:column;
    gap:8px;
    width:100%;
    margin:0 !important;
    position:static !important;
}

.hero-booking-form label{
    display:block !important;
    color:#111827 !important;
    font-weight:700;
}

.hero-booking-form input,
.hero-booking-form select{
    display:block !important;
    width:100% !important;
    height:54px;
    box-sizing:border-box;
    margin:0 !important;
    padding:0 16px;
    position:static !important;
    border:1px solid #d7dde7;
    border-radius:14px;
    background:#f8fafc !important;
    color:#111827 !important;
    font:inherit;
}

.hero-booking-form button{
    width:100%;
    min-height:56px;
    margin:4px 0 0 !important;
}

.hero-reservation-note{
    display:block;
    text-align:center;
    color:#6b7280;
    font-size:13px;
}

@media(max-width:1100px){

    .hero-card{
        max-width:600px;
        margin:30px auto 0 !important;
    }

}

@media(max-width:600px){

    .hero-card{
        padding:25px 20px !important;
    }

    .hero-card-title{
        font-size:24px;
    }

}
/*=========================================
        NEW PREMIUM HOME HERO
=========================================*/

#home.home-hero{
    position:relative;
    min-height:850px;
    display:flex;
    align-items:center;
    padding:150px 0 100px;
    overflow:hidden;

    background-image:
        linear-gradient(
            90deg,
            rgba(7,12,24,.96) 0%,
            rgba(16,6,8,.91) 45%,
            rgba(70,0,0,.70) 100%
        ),
        url("../img/hero-home.jpg");

    background-size: 115%;
background-position: center 40%;
background-repeat: no-repeat;
}

.home-hero-overlay{
    position:absolute;
    inset:0;
    z-index:0;

    background:
        radial-gradient(
            circle at 85% 30%,
            rgba(255,20,20,.17),
            transparent 38%
        );
}

.home-hero-container{
    position:relative;
    z-index:2;

    width:100%;

    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(360px,460px);
    align-items:center;
    gap:80px;
}


/* TEXTO PRINCIPAL */

.home-hero-content{
    max-width:780px;
}

.home-hero-label{
    display:inline-flex;
    align-items:center;

    margin-bottom:28px;
    padding:11px 24px;

    border:1px solid rgba(255,255,255,.22);
    border-radius:50px;

    background:rgba(255,20,20,.92);

    color:#fff;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.home-hero-content h1{
    margin:0 0 26px;

    color:#fff;
    font-size:clamp(54px,6vw,88px);
    font-weight:800;
    line-height:1.02;
    letter-spacing:-3px;
}

.home-hero-content h1 span{
    display:block;
}

.home-hero-content p{
    max-width:720px;
    margin:0 0 38px;

    color:rgba(255,255,255,.82);
    font-size:19px;
    line-height:1.8;
}

.home-hero-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:18px;
}

.home-hero-primary-button,
.home-hero-secondary-button{
    min-width:185px;
    min-height:58px;

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

    padding:15px 28px;
    border-radius:50px;

    font-weight:800;
    text-decoration:none;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}

.home-hero-primary-button{
    background:#ff1111;
    color:#fff;

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

.home-hero-primary-button:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 45px rgba(255,17,17,.42);
}

.home-hero-secondary-button{
    border:2px solid rgba(255,255,255,.85);
    background:rgba(255,255,255,.05);
    color:#fff;
    backdrop-filter:blur(8px);
}

.home-hero-secondary-button:hover{
    transform:translateY(-4px);
    background:#fff;
    color:#111827;
}


/* TARJETA DE RESERVA */

.home-reservation-card{
    width:100%;
    max-width:460px;
    justify-self:end;

    padding:34px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:30px;

    background:rgba(255,255,255,.97);

    box-shadow:
        0 35px 80px rgba(0,0,0,.32);

    backdrop-filter:blur(15px);
}

.home-reservation-heading{
    display:flex;
    align-items:center;
    gap:16px;

    margin-bottom:28px;
    padding-bottom:23px;

    border-bottom:1px solid #e6eaf0;
}

.home-reservation-icon{
    width:58px;
    height:58px;

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

    border-radius:17px;

    background:rgba(255,17,17,.10);
    color:#ff1111;

    font-size:23px;
}

.home-reservation-heading h2{
    margin:0 0 5px;

    color:#111827;
    font-size:25px;
    font-weight:800;
    line-height:1.2;
}

.home-reservation-heading p{
    margin:0;

    color:#718096;
    font-size:13px;
}

.home-reservation-form{
    display:flex;
    flex-direction:column;
    gap:17px;

    width:100%;
}

.home-form-field{
    display:flex;
    flex-direction:column;
    gap:8px;

    width:100%;
    min-width:0;
}

.home-form-field label{
    display:block;

    color:#111827;
    font-size:13px;
    font-weight:800;
}

.home-form-field input,
.home-form-field select{
    display:block;

    width:100%;
    min-width:0;
    height:54px;

    box-sizing:border-box;
    margin:0;
    padding:0 16px;

    border:1px solid #d9dee8;
    border-radius:14px;
    outline:none;

    background:#f7f9fc;
    color:#111827;

    font-family:inherit;
    font-size:14px;

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.home-form-field input::placeholder{
    color:#8a94a5;
}

.home-form-field input:focus,
.home-form-field select:focus{
    border-color:#ff1111;
    background:#fff;

    box-shadow:
        0 0 0 4px rgba(255,17,17,.10);
}

.home-reservation-button{
    width:100%;
    min-height:57px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    margin-top:4px;
    padding:15px 22px;

    border:0;
    border-radius:16px;
    cursor:pointer;

    background:#ff1111;
    color:#fff;

    font-family:inherit;
    font-size:16px;
    font-weight:800;

    box-shadow:0 14px 30px rgba(255,17,17,.25);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.home-reservation-button:hover{
    transform:translateY(-3px);
    box-shadow:0 19px 40px rgba(255,17,17,.38);
}

.home-reservation-button i{
    transition:transform .3s ease;
}

.home-reservation-button:hover i{
    transform:translateX(5px);
}

.home-reservation-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    margin:1px 0 0;

    color:#718096;
    font-size:12px;
    text-align:center;
}

.home-reservation-note i{
    color:#17b866;
}


/* RESPONSIVE */

@media(max-width:1150px){

    #home.home-hero{
        padding:140px 0 90px;
    }

    .home-hero-container{
        grid-template-columns:1fr;
        gap:55px;
    }

    .home-hero-content{
        max-width:850px;
    }

    .home-reservation-card{
        max-width:650px;
        justify-self:start;
    }

}

@media(max-width:700px){

    #home.home-hero{
        min-height:auto;
        padding:125px 0 70px;

        background-position:62% center;
    }

    .home-hero-container{
        gap:42px;
    }

    .home-hero-content h1{
        font-size:47px;
        letter-spacing:-2px;
    }

    .home-hero-content p{
        font-size:16px;
    }

    .home-hero-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .home-hero-primary-button,
    .home-hero-secondary-button{
        width:100%;
    }

    .home-reservation-card{
        padding:25px 20px;
        border-radius:23px;
    }

    .home-reservation-heading h2{
        font-size:22px;
    }

}
/*==================================
        CORPORAN SITE LOGO
==================================*/

.logo{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
}

/*==================================
        HEADER LOGO
==================================*/

.logo{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    flex-shrink:0;
}

.site-logo-image{
    width:60px;
    height:60px;
    object-fit:contain;
    border-radius:8px;
    background:#fff;
    padding:3px;
}

.logo span{
    color:#fff;
    font-size:2rem;
    font-weight:800;
    line-height:1;
    white-space:nowrap;
}

@media(max-width:1100px){

    .logo span{
        font-size:1.4rem;
    }

}

@media(max-width:850px){

    .logo span{
        display:none;
    }

}

.logo span{
    color:#fff;
    font-weight:800;
    line-height:1.1;
}

@media(max-width:700px){

    /*==================================
        HEADER LOGO
==================================*/

.logo{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    flex-shrink:0;
}

.site-logo-image{
    width:60px;
    height:60px;
    object-fit:contain;
    border-radius:8px;
    background:#fff;
    padding:3px;
}

.logo span{
    color:#fff;
    font-size:2rem;
    font-weight:800;
    line-height:1;
    white-space:nowrap;
}

@media(max-width:1100px){

    .logo span{
        font-size:1.4rem;
    }

}

@media(max-width:850px){

    .logo span{
        display:none;
    }

}

    .logo span{
        font-size:18px;
    }

}
/* FOOTER LOGO CORPORAN */

.footer-logo{
    display:inline-flex;
    align-items:center;
    gap:12px;
}

.footer-logo-image{
    width:52px;
    height:52px;
    object-fit:contain;
    display:block;
}

.footer-logo span{
    color:white;
    font-size:23px;
    font-weight:800;
    line-height:1.1;
}

@media(max-width:650px){

    .footer-logo-image{
        width:44px;
        height:44px;
    }

    .footer-logo span{
        font-size:19px;
    }

}
/*==================================
    HEADER FINAL ADJUSTMENT
==================================*/

.header .container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
}

/* LOGO */

.logo{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
    max-width:430px;
}

.site-logo-image{
    width:60px;
    height:60px;
    padding:3px;
    object-fit:contain;
    border-radius:8px;
    background:#fff;
}

.logo span{
    color:#fff;
    font-size:1.65rem;
    font-weight:800;
    line-height:1;
    white-space:nowrap;
}

/* MENÚ */

.navbar{
    margin-left:auto;
}

.navbar ul{
    display:flex;
    align-items:center;
    gap:28px;
}

.navbar a{
    white-space:nowrap;
}

/* BOOK NOW */

.header-buttons{
    flex-shrink:0;
}

.header-buttons .btn,
.header .btn-primary{
    width:auto !important;
    min-width:145px !important;
    height:54px !important;
    padding:0 26px !important;

    display:inline-flex !important;
    align-items:center;
    justify-content:center;

    border-radius:999px !important;
    background:#ff1111 !important;
    color:#fff !important;

    font-size:16px;
    font-weight:800;
    line-height:1;

    white-space:nowrap !important;

    box-shadow:0 12px 28px rgba(255,17,17,.28);
}

.header-buttons .btn:hover,
.header .btn-primary:hover{
    background:#e60000 !important;
    transform:translateY(-2px);
}

/* TABLET */

@media(max-width:1250px){

    .logo span{
        font-size:1.35rem;
    }

    .navbar ul{
        gap:20px;
    }

    .header-buttons .btn,
    .header .btn-primary{
        min-width:125px !important;
        padding:0 20px !important;
    }

}

/* CUANDO YA NO CABE */

@media(max-width:1050px){

    .logo span{
        display:none;
    }

    .navbar ul{
        gap:18px;
    }

}
/*==================================
      HEADER STICKY Y VISIBLE
==================================*/

.header{
    position:sticky !important;
    top:0;
    left:0;
    width:100%;

    z-index:9999;

    background:rgba(10,18,32,.96) !important;
    border-bottom:1px solid rgba(255,255,255,.08);

    box-shadow:0 8px 30px rgba(0,0,0,.14);
    backdrop-filter:blur(14px);
}

.header .container{
    min-height:86px;
}

.header .navbar a{
    color:#fff !important;
}

.header .navbar a:hover,
.header .navbar a.active{
    color:#ff1919 !important;
}

.header .navbar a::after{
    background:#ff1919 !important;
}
/*=========================================
      CORPORAN PREMIUM DARK DESIGN
=========================================*/

/* FONDO GENERAL DEL INDEX */

body{
    background:#080808;
    color:#f5f5f5;
}

.features,
.about,
.fleet,
.gallery,
.services,
.contact,
.reservation{
    background:#080808 !important;
}


/* TÍTULOS DE SECCIONES */

.section-title h2,
.section-title h3,
.features h2,
.about h2,
.fleet h2,
.gallery h2,
.services h2,
.contact h2,
.reservation h2 {
    color: #172033 !important;
    font-weight: 800;
}

.section-title p,
.features > p,
.about > p,
.fleet > p,
.gallery > p,
.services > p,
.contact > p,
.reservation > p {
    color: #6c757d !important;
}


/* TARJETAS DE VEHÍCULOS */

.car-card.modern-card{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
    border-radius:22px;
    background:#141414 !important;
    color:#ffffff;
    box-shadow:0 18px 45px rgba(0,0,0,.28);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}

.car-card.modern-card:hover{
    transform:translateY(-9px);
    border-color:#e50914;
    box-shadow:0 25px 60px rgba(229,9,20,.25);
}


/* FOTO DE LA TARJETA */

.car-card.modern-card .car-slider{
    overflow:hidden;
}

.car-card.modern-card .car-slide{
    transition:transform .6s ease;
}

.car-card.modern-card:hover .car-slide.active{
    transform:scale(1.06);
}


/* INFORMACIÓN */

.car-card.modern-card .car-info{
    background:#141414 !important;
}

.car-card.modern-card h3{
    color:#ffffff !important;
}

.car-card.modern-card .car-subtitle{
    color:#b8b8b8 !important;
}

.car-card.modern-card .car-features{
    border-color:rgba(255,255,255,.09) !important;
}

.car-card.modern-card .car-features div,
.car-card.modern-card .car-features span{
    color:#dddddd !important;
}

.car-card.modern-card .car-features i{
    color:#e50914 !important;
}


/* PRECIO */

.car-card.modern-card .modern-price > span{
    color:#aaaaaa !important;
}

.car-card.modern-card .modern-price h4{
    color:#ffffff !important;
}

.car-card.modern-card .modern-price small{
    color:#aaaaaa !important;
}


/* CATEGORÍA Y FEATURED */

.car-card.modern-card .category{
    background:rgba(8,8,8,.88) !important;
    color:#ffffff !important;
}

.car-card.modern-card .car-badge{
    background:#e50914 !important;
    color:#ffffff !important;
}


/* BOTÓN RESERVE NOW */

.car-card.modern-card .reserve-btn{
    background:#e50914 !important;
    color:#ffffff !important;
    border:1px solid #e50914 !important;
}

.car-card.modern-card .reserve-btn:hover{
    background:#ffffff !important;
    color:#e50914 !important;
    transform:translateY(-3px);
}


/* BOTÓN VIEW DETAILS */

.car-card.modern-card .details-btn{
    background:transparent !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.35) !important;
}

.car-card.modern-card .details-btn:hover{
    background:#ffffff !important;
    color:#111111 !important;
    border-color:#ffffff !important;
    transform:translateY(-3px);
}


/* BOTONES GENERALES */

.btn-primary{
    background:#e50914 !important;
    color:#ffffff !important;
    border-color:#e50914 !important;
}

.btn-primary:hover{
    background:#ffffff !important;
    color:#e50914 !important;
}


/* MENÚ CON LÍNEA ROJA */

.navbar a{
    position:relative;
}

.navbar a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-8px;

    width:0;
    height:2px;

    background:#e50914;
    transition:width .3s ease;
}

.navbar a:hover::after,
.navbar a.active::after{
    width:100%;
}

.navbar a:hover,
.navbar a.active{
    color:#e50914 !important;
}
/*====================================================
    CORPORAN RENT CAR — INDEX DARK THEME FINAL FIX
    PEGAR AL FINAL ABSOLUTO DE STYLE.CSS
====================================================*/

/* PALETA GENERAL DEL INDEX */

body:has(.home-hero){
    background:#070707 !important;
    color:#f5f5f5;
}


/* TODAS LAS SECCIONES DEL INDEX, MENOS EL HERO */

body:has(.home-hero) section:not(.home-hero){
    background:#070707 !important;
    color:#ffffff !important;
}


/* CONTENEDORES GENERALES */

body:has(.home-hero) .features,
body:has(.home-hero) .about,
body:has(.home-hero) .services,
body:has(.home-hero) .fleet,
body:has(.home-hero) .gallery,
body:has(.home-hero) .testimonials,
body:has(.home-hero) .faq,
body:has(.home-hero) .reservation,
body:has(.home-hero) .contact{
    background:#070707 !important;
    color:#ffffff !important;
}


/*====================================================
    TÍTULOS Y TEXTOS GENERALES
====================================================*/

body:has(.home-hero) section:not(.home-hero) h1,
body:has(.home-hero) section:not(.home-hero) h2,
body:has(.home-hero) section:not(.home-hero) h3,
body:has(.home-hero) section:not(.home-hero) h4{
    color:#ffffff !important;
}

body:has(.home-hero) section:not(.home-hero) p{
    color:#b7b7b7 !important;
}

body:has(.home-hero) .section-title,
body:has(.home-hero) .section-heading,
body:has(.home-hero) .section-header{
    color:#ffffff !important;
}

body:has(.home-hero) .section-title p,
body:has(.home-hero) .section-heading p,
body:has(.home-hero) .section-header p{
    color:#aeb4bf !important;
}


/* ETIQUETAS ROJAS COMO ABOUT, SERVICES, QUESTIONS */

body:has(.home-hero) .section-label,
body:has(.home-hero) .section-subtitle,
body:has(.home-hero) .small-title,
body:has(.home-hero) .eyebrow{
    color:#ff2020 !important;
}


/*====================================================
    BLOQUE SUPERIOR DE BENEFICIOS
====================================================*/

body:has(.home-hero) .features{
    padding-top:55px !important;
    padding-bottom:70px !important;
}

body:has(.home-hero) .features .container,
body:has(.home-hero) .features-grid,
body:has(.home-hero) .features-box{
    background:#111111 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    border-radius:25px !important;

    box-shadow:
        0 25px 60px rgba(0,0,0,.35) !important;
}

body:has(.home-hero) .feature-box{
    background:transparent !important;
    color:#ffffff !important;
}

body:has(.home-hero) .feature-box h3,
body:has(.home-hero) .feature-box h4{
    color:#ffffff !important;
}

body:has(.home-hero) .feature-box p{
    color:#bdbdbd !important;
}

body:has(.home-hero) .feature-box i{
    color:#ff1717 !important;
}


/*====================================================
    ABOUT US
====================================================*/

body:has(.home-hero) .about{
    padding-top:100px !important;
    padding-bottom:100px !important;
}

body:has(.home-hero) .about-content h2{
    color:#ffffff !important;
}

body:has(.home-hero) .about-content p{
    color:#b5b5b5 !important;
    line-height:1.8;
}

body:has(.home-hero) .about-content strong,
body:has(.home-hero) .about-content span:not(.section-label){
    color:#ffffff !important;
}

body:has(.home-hero) .about-stats h3,
body:has(.home-hero) .about-stat h3,
body:has(.home-hero) .stat-number{
    color:#ff1717 !important;
}

body:has(.home-hero) .about-stats p,
body:has(.home-hero) .about-stat p{
    color:#9f9f9f !important;
}

body:has(.home-hero) .about-image img{
    border:1px solid rgba(255,255,255,.10);
    box-shadow:0 25px 65px rgba(0,0,0,.45);
}


/*====================================================
    SERVICES
====================================================*/

body:has(.home-hero) .services{
    padding-top:95px !important;
    padding-bottom:100px !important;
}

body:has(.home-hero) .service-card{
    background:#141414 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    color:#ffffff !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.30) !important;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

body:has(.home-hero) .service-card:hover{
    transform:translateY(-8px);
    border-color:#ff1717 !important;

    box-shadow:
        0 24px 60px rgba(255,23,23,.18) !important;
}

body:has(.home-hero) .service-card h3,
body:has(.home-hero) .service-card h4{
    color:#ffffff !important;
}

body:has(.home-hero) .service-card p{
    color:#b8b8b8 !important;
}

body:has(.home-hero) .service-card i{
    color:#ff1717 !important;
}


/*====================================================
    OFERTA ESPECIAL
====================================================*/

body:has(.home-hero) .special-offer,
body:has(.home-hero) .offer-section,
body:has(.home-hero) .promotion,
body:has(.home-hero) .cta-section{
    background:
        linear-gradient(
            135deg,
            #210000 0%,
            #740000 55%,
            #b80000 100%
        ) !important;

    color:#ffffff !important;
}

body:has(.home-hero) .special-offer h2,
body:has(.home-hero) .offer-section h2,
body:has(.home-hero) .promotion h2,
body:has(.home-hero) .cta-section h2{
    color:#ffffff !important;
}

body:has(.home-hero) .special-offer p,
body:has(.home-hero) .offer-section p,
body:has(.home-hero) .promotion p,
body:has(.home-hero) .cta-section p{
    color:rgba(255,255,255,.82) !important;
}


/*====================================================
    TESTIMONIALS
====================================================*/

body:has(.home-hero) .testimonials{
    padding-top:100px !important;
    padding-bottom:100px !important;
}

body:has(.home-hero) .testimonial-card{
    background:#141414 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    color:#ffffff !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.28) !important;
}

body:has(.home-hero) .testimonial-card h3,
body:has(.home-hero) .testimonial-card h4,
body:has(.home-hero) .testimonial-card strong{
    color:#ffffff !important;
}

body:has(.home-hero) .testimonial-card p,
body:has(.home-hero) .testimonial-card span{
    color:#b8b8b8 !important;
}

body:has(.home-hero) .testimonial-card .stars,
body:has(.home-hero) .testimonial-card .fa-star{
    color:#ffb800 !important;
}


/*====================================================
    FAQ
====================================================*/

body:has(.home-hero) .faq{
    padding-top:100px !important;
    padding-bottom:110px !important;
}

body:has(.home-hero) .faq h2{
    color:#ffffff !important;
}

body:has(.home-hero) .faq-item,
body:has(.home-hero) .faq-question,
body:has(.home-hero) details{
    background:#141414 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    color:#ffffff !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.25) !important;
}

body:has(.home-hero) .faq-item:hover,
body:has(.home-hero) details:hover{
    border-color:#ff1717 !important;
}

body:has(.home-hero) .faq-item h3,
body:has(.home-hero) .faq-question,
body:has(.home-hero) summary{
    color:#ffffff !important;
}

body:has(.home-hero) .faq-answer,
body:has(.home-hero) details p{
    color:#b8b8b8 !important;
}


/*====================================================
    RESERVATION DEL INDEX
====================================================*/

body:has(.home-hero) .reservation{
    padding-top:105px !important;
    padding-bottom:110px !important;
}

body:has(.home-hero) .reservation h2{
    color:#ffffff !important;
}

body:has(.home-hero) .reservation form{
    background:#121212 !important;
    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:24px !important;

    padding:35px !important;

    box-shadow:
        0 25px 65px rgba(0,0,0,.38) !important;
}

body:has(.home-hero) .reservation label{
    color:#ffffff !important;
}

body:has(.home-hero) .reservation input,
body:has(.home-hero) .reservation select,
body:has(.home-hero) .reservation textarea{
    background:#1c1c1c !important;
    color:#ffffff !important;

    border:1px solid rgba(255,255,255,.14) !important;
}

body:has(.home-hero) .reservation input::placeholder,
body:has(.home-hero) .reservation textarea::placeholder{
    color:#8e8e8e !important;
}

body:has(.home-hero) .reservation input:focus,
body:has(.home-hero) .reservation select:focus,
body:has(.home-hero) .reservation textarea:focus{
    border-color:#ff1717 !important;

    box-shadow:
        0 0 0 4px rgba(255,23,23,.10) !important;
}


/* OPCIONES DE SELECT */

body:has(.home-hero) .reservation select option{
    background:#1c1c1c;
    color:#ffffff;
}


/*====================================================
    BOTONES GENERALES DEL INDEX
====================================================*/

body:has(.home-hero) section:not(.home-hero) .btn,
body:has(.home-hero) section:not(.home-hero) button[type="submit"]{
    background:#ff1717 !important;
    color:#ffffff !important;

    border:1px solid #ff1717 !important;
    border-radius:999px !important;

    box-shadow:
        0 12px 28px rgba(255,23,23,.24);

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease,
        box-shadow .3s ease;
}

body:has(.home-hero) section:not(.home-hero) .btn:hover,
body:has(.home-hero) section:not(.home-hero) button[type="submit"]:hover{
    transform:translateY(-3px);

    background:#ffffff !important;
    color:#e50914 !important;

    box-shadow:
        0 18px 38px rgba(255,23,23,.33);
}


/*====================================================
    FOOTER
====================================================*/

body:has(.home-hero) footer{
    background:#030303 !important;
    color:#ffffff !important;
}

body:has(.home-hero) footer h3,
body:has(.home-hero) footer h4{
    color:#ffffff !important;
}

body:has(.home-hero) footer p,
body:has(.home-hero) footer a{
    color:#aeb2bb !important;
}

body:has(.home-hero) footer a:hover{
    color:#ff1717 !important;
}


/*====================================================
    DIVISORES Y BORDES
====================================================*/

body:has(.home-hero) section:not(.home-hero){
    border-color:rgba(255,255,255,.06) !important;
}


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

@media(max-width:768px){

    body:has(.home-hero) .about,
    body:has(.home-hero) .services,
    body:has(.home-hero) .testimonials,
    body:has(.home-hero) .faq,
    body:has(.home-hero) .reservation{
        padding-top:70px !important;
        padding-bottom:75px !important;
    }

    body:has(.home-hero) .reservation form{
        padding:24px 18px !important;
    }

}
/*==================================
      WHATSAPP FLOAT BUTTON
==================================*/

.whatsapp-float{
    position:fixed;
    right:28px;
    bottom:28px;

    width:62px;
    height:62px;

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

    border-radius:50%;

    background:#25d366;
    color:#ffffff;

    font-size:30px;
    text-decoration:none;

    box-shadow:0 14px 35px rgba(37,211,102,.35);

    z-index:9998;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.whatsapp-float:hover{
    transform:translateY(-5px) scale(1.05);
    box-shadow:0 20px 45px rgba(37,211,102,.5);
}

@media(max-width:600px){

    .whatsapp-float{
        right:18px;
        bottom:18px;
        width:56px;
        height:56px;
        font-size:27px;
    }

}
/* FOOTER CONTACT FIX */

.footer-email-link{
    display:inline-block;
    max-width:220px;
    font-size:12px !important;
    line-height:1.4;
    overflow-wrap:anywhere;
    word-break:break-word;
    text-transform:lowercase;
}
/* CORREO DEL FOOTER */

.footer-email-link{
    display:flex !important;
    align-items:flex-start;
    gap:10px;

    max-width:230px;

    font-size:12px !important;
    line-height:1.4;
    text-transform:lowercase;
}

.footer-email-link i{
    flex-shrink:0;
    margin-top:2px;

    color:#ff1717 !important;
    font-size:14px;
}

.footer-email-link span{
    overflow-wrap:anywhere;
    word-break:break-word;
}
/* VEHICLE DETAILS IMAGE TRANSITION */

#vehicle-main-image{
    transition:
        opacity .2s ease,
        transform .5s ease;
}

.main-image-container:hover #vehicle-main-image{
    transform:scale(1.025);
}

.thumbnail-button{
    cursor:pointer;
    transition:
        transform .25s ease,
        border-color .25s ease,
        opacity .25s ease;
}

.thumbnail-button:hover{
    transform:translateY(-4px);
}

.thumbnail-button.active{
    border-color:#ff1717 !important;
}
/*=========================================
      PREMIUM MASONRY GALLERY
=========================================*/

.premium-gallery-grid{
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    grid-auto-rows:120px;
    gap:18px;
}

.premium-gallery-item{
    position:relative;
    overflow:hidden;

    border-radius:22px;
    border:1px solid rgba(255,255,255,.08);

    background:#111;

    box-shadow:0 18px 45px rgba(0,0,0,.35);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}

/* TAMAÑOS DIFERENTES PARA HACER EL MOSAICO */

.premium-gallery-item:nth-child(1){
    grid-column:span 7;
    grid-row:span 4;
}

.premium-gallery-item:nth-child(2){
    grid-column:span 5;
    grid-row:span 4;
}

.premium-gallery-item:nth-child(3){
    grid-column:span 4;
    grid-row:span 3;
}

.premium-gallery-item:nth-child(4){
    grid-column:span 4;
    grid-row:span 3;
}

.premium-gallery-item:nth-child(5){
    grid-column:span 4;
    grid-row:span 3;
}

.premium-gallery-item:nth-child(6){
    grid-column:span 5;
    grid-row:span 4;
}

.premium-gallery-item:nth-child(7){
    grid-column:span 7;
    grid-row:span 4;
}

.premium-gallery-item:nth-child(8){
    grid-column:span 12;
    grid-row:span 4;
}


/* IMÁGENES */

.premium-gallery-item img{
    width:100%;
    height:100%;

    display:block;
    object-fit:cover;

    transition:
        transform .7s ease,
        filter .45s ease;
}


/* OVERLAY */

.premium-gallery-overlay{
    position:absolute;
    inset:0;

    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:flex-start;

    padding:28px;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.02) 15%,
            rgba(0,0,0,.20) 50%,
            rgba(0,0,0,.93) 100%
        );

    transition:background .4s ease;
}

.premium-gallery-overlay span{
    display:inline-flex;

    margin-bottom:10px;
    padding:7px 13px;

    border-radius:999px;

    background:#ff1717;
    color:#fff;

    font-size:12px;
    font-weight:800;
    letter-spacing:.6px;
    text-transform:uppercase;
}

.premium-gallery-overlay h3{
    margin:0;

    color:#fff !important;
    font-size:clamp(22px, 2vw, 34px);
    font-weight:800;
    line-height:1.1;

    text-shadow:0 5px 20px rgba(0,0,0,.45);
}


/* BOTÓN EXPANDIR */

.open-gallery-image{
    position:absolute;
    top:20px;
    right:20px;

    width:48px;
    height:48px;

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

    border:1px solid rgba(255,255,255,.35);
    border-radius:50%;
    cursor:pointer;

    background:rgba(0,0,0,.48);
    color:#fff;

    font-size:17px;

    backdrop-filter:blur(8px);

    opacity:0;
    transform:translateY(-8px);

    transition:
        opacity .3s ease,
        transform .3s ease,
        background .3s ease;
}


/* HOVER */

.premium-gallery-item:hover{
    transform:translateY(-7px);

    border-color:#ff1717;

    box-shadow:
        0 28px 70px rgba(255,23,23,.22);
}

.premium-gallery-item:hover img{
    transform:scale(1.08);
    filter:brightness(.78) saturate(1.08);
}

.premium-gallery-item:hover .premium-gallery-overlay{
    background:
        linear-gradient(
            180deg,
            rgba(255,23,23,.06) 0%,
            rgba(0,0,0,.30) 48%,
            rgba(0,0,0,.96) 100%
        );
}

.premium-gallery-item:hover .open-gallery-image{
    opacity:1;
    transform:translateY(0);
}

.open-gallery-image:hover{
    background:#ff1717;
    border-color:#ff1717;
}


/* TABLET */

@media(max-width:1000px){

    .premium-gallery-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
        grid-auto-rows:280px;
    }

    .premium-gallery-item{
        grid-column:auto !important;
        grid-row:auto !important;
    }

}


/* CELULAR */

@media(max-width:650px){

    .premium-gallery-grid{
        grid-template-columns:1fr;
        grid-auto-rows:260px;
        gap:15px;
    }

    .premium-gallery-overlay{
        padding:22px;
    }

    .open-gallery-image{
        opacity:1;
        transform:none;
    }

}
.premium-gallery-grid{
    display:grid !important;
}
/*=========================================
   FORCE PREMIUM GALLERY MOSAIC
=========================================*/

.premium-gallery-grid{
    display:grid !important;
    grid-template-columns:repeat(12, minmax(0, 1fr)) !important;
    grid-auto-rows:110px !important;
    gap:18px !important;
    width:100% !important;
}

.premium-gallery-item{
    width:auto !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
}

/* FILA 1 */

.premium-gallery-item:nth-child(1){
    grid-column:span 7 !important;
    grid-row:span 4 !important;
}

.premium-gallery-item:nth-child(2){
    grid-column:span 5 !important;
    grid-row:span 4 !important;
}

/* FILA 2 */

.premium-gallery-item:nth-child(3){
    grid-column:span 4 !important;
    grid-row:span 3 !important;
}

.premium-gallery-item:nth-child(4){
    grid-column:span 4 !important;
    grid-row:span 3 !important;
}

.premium-gallery-item:nth-child(5){
    grid-column:span 4 !important;
    grid-row:span 3 !important;
}

/* FILA 3 */

.premium-gallery-item:nth-child(6){
    grid-column:span 5 !important;
    grid-row:span 4 !important;
}

.premium-gallery-item:nth-child(7){
    grid-column:span 7 !important;
    grid-row:span 4 !important;
}

/* FILA FINAL */

.premium-gallery-item:nth-child(8){
    grid-column:span 12 !important;
    grid-row:span 4 !important;
}

.premium-gallery-item img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
}

/* TABLET */

@media(max-width:1000px){

    .premium-gallery-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        grid-auto-rows:280px !important;
    }

    .premium-gallery-item{
        grid-column:auto !important;
        grid-row:auto !important;
    }

}

/* CELULAR */

@media(max-width:650px){

    .premium-gallery-grid{
        grid-template-columns:1fr !important;
        grid-auto-rows:260px !important;
    }

}
/*=========================================
   RESERVATION SUMMARY FINAL CONTRAST FIX
=========================================*/

.reservation-summary{
    background:#111111 !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.08) !important;
    box-shadow:0 22px 55px rgba(0,0,0,.28) !important;
}

.reservation-summary h2,
.reservation-summary h3,
.reservation-summary strong{
    color:#ffffff !important;
}

.reservation-summary p,
.reservation-summary span{
    color:#b8b8b8 !important;
}

.reservation-summary .summary-label,
.reservation-summary #summary-vehicle-category{
    color:#ff1717 !important;
}

.summary-vehicle{
    border-bottom:1px solid rgba(255,255,255,.10) !important;
    padding-bottom:22px;
}

.summary-vehicle img{
    border:1px solid rgba(255,255,255,.10);
}

.summary-lines,
.summary-price-breakdown{
    border-bottom:1px solid rgba(255,255,255,.10) !important;
}

.summary-lines > div,
.summary-price-breakdown > div{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    padding:13px 0;
}

.summary-lines strong,
.summary-price-breakdown strong{
    text-align:right;
}

.summary-tax-line small{
    display:block;
    margin-top:4px;
    color:#8f8f8f !important;
    font-size:11px;
}

.summary-total{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding-top:22px;
}

.summary-total span{
    color:#ffffff !important;
    font-weight:800;
}

.summary-total strong{
    color:#ff1717 !important;
    font-size:28px;
}

.summary-note{
    margin-top:20px;
    color:#9b9b9b !important;
    line-height:1.6;
}

.reservation-submit{
    background:#ff1717 !important;
    color:#ffffff !important;
    border:none !important;
}

.reservation-submit:hover{
    background:#d80000 !important;
    color:#ffffff !important;
}
/*=========================================
   RESERVATION PAYMENT ACTIONS
=========================================*/

.reservation-payment-actions{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:24px;
}

.paypal-payment-button,
.reservation-whatsapp-button{
    width:100%;
    min-height:54px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    padding:14px 20px;
    border-radius:14px;

    font-weight:800;
    text-decoration:none;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}

.paypal-payment-button{
    background:#ffc439;
    color:#111827;
    box-shadow:0 12px 28px rgba(255,196,57,.20);
}

.paypal-payment-button:hover{
    transform:translateY(-3px);
    background:#ffb900;
    box-shadow:0 18px 38px rgba(255,196,57,.32);
}

.reservation-whatsapp-button{
    background:#25d366;
    color:#ffffff;
    box-shadow:0 12px 28px rgba(37,211,102,.20);
}

.reservation-whatsapp-button:hover{
    transform:translateY(-3px);
    background:#1fbd59;
    box-shadow:0 18px 38px rgba(37,211,102,.32);
}
/*=========================================
   RESERVATION PAYMENT BUTTONS — FINAL FIX
=========================================*/

.reservation-summary .reservation-payment-actions{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;

    width:100% !important;
    margin:24px 0 0 !important;
    padding:0 !important;
}

.reservation-summary .paypal-payment-button,
.reservation-summary .reservation-whatsapp-button{
    position:static !important;

    width:100% !important;
    max-width:100% !important;
    min-height:52px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;

    margin:0 !important;
    padding:13px 15px !important;

    border:none !important;
    border-radius:13px !important;

    font-size:14px !important;
    font-weight:800 !important;
    line-height:1.2 !important;
    text-align:center !important;
    text-decoration:none !important;

    box-sizing:border-box !important;
    transform:none;
}

.reservation-summary .paypal-payment-button{
    background:#ffc439 !important;
    color:#111827 !important;
}

.reservation-summary .reservation-whatsapp-button{
    background:#25d366 !important;
    color:#ffffff !important;
}

.reservation-summary .paypal-payment-button:hover{
    background:#ffb900 !important;
    color:#111827 !important;
    transform:translateY(-3px) !important;
}

.reservation-summary .reservation-whatsapp-button:hover{
    background:#1fbd59 !important;
    color:#ffffff !important;
    transform:translateY(-3px) !important;
}
/*=========================================
        PAYMENT OPTION SELECTOR
=========================================*/

.payment-choice{
    margin-top:24px;
    padding-top:22px;
    border-top:1px solid rgba(255,255,255,.10);
}

.payment-choice h3{
    margin:0 0 15px;
    color:#ffffff !important;
    font-size:17px;
}

.payment-choice-card{
    position:relative;

    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:13px;

    width:100%;
    margin-bottom:12px;
    padding:16px;

    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    cursor:pointer;

    background:#1a1a1a;

    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease;
}

.payment-choice-card:hover{
    transform:translateY(-2px);
    border-color:#ff1717;
}

.payment-choice-card:has(input:checked){
    border-color:#ff1717;
    background:rgba(255,23,23,.09);
}

.payment-choice-card input{
    accent-color:#ff1717;
}

.payment-choice-content{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.payment-choice-content strong{
    color:#ffffff !important;
    font-size:14px;
}

.payment-choice-content small{
    color:#969696;
    font-size:11px;
    line-height:1.4;
}

.payment-choice-price{
    color:#ff1717 !important;
    font-size:14px;
    white-space:nowrap;
}

.pending-balance-line{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;

    margin-top:15px;
    padding:14px 0 2px;
}

.pending-balance-line span{
    color:#b8b8b8 !important;
}

.pending-balance-line strong{
    color:#ffffff !important;
}
/*=========================================
      SERVICES PAGE — PREMIUM DARK
=========================================*/

.services-page{
    padding:110px 0;
    background:#070707 !important;
    color:#ffffff;
}

.services-page .section-title{
    max-width:760px;
    margin:0 auto 55px;
    text-align:center;
}

.services-page .section-title span{
    display:inline-block;
    margin-bottom:14px;

    color:#ff1717 !important;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.services-page .section-title h2{
    margin:0 0 18px;

    color:#ffffff !important;
    font-size:clamp(38px,5vw,58px);
    font-weight:800;
    line-height:1.08;
}

.services-page .section-title p{
    margin:0;

    color:#aeb4bf !important;
    font-size:17px;
    line-height:1.7;
}


/* GRID */

.services-page-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:24px;
}


/* CARDS */

.service-premium-card{
    position:relative;
    overflow:hidden;

    min-height:315px;
    padding:34px;

    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            #171717 0%,
            #101010 100%
        ) !important;

    color:#ffffff;

    box-shadow:
        0 20px 50px rgba(0,0,0,.30);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.service-premium-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:4px;

    background:
        linear-gradient(
            90deg,
            #ff1717,
            #7b0000
        );

    transform:scaleX(0);
    transform-origin:left;

    transition:transform .35s ease;
}

.service-premium-card:hover{
    transform:translateY(-9px);
    border-color:rgba(255,23,23,.70);

    box-shadow:
        0 28px 70px rgba(255,23,23,.17);
}

.service-premium-card:hover::before{
    transform:scaleX(1);
}


/* ICONO PRINCIPAL */

.service-premium-card > i{
    width:66px;
    height:66px;

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

    margin-bottom:25px;

    border-radius:19px;

    background:rgba(255,23,23,.10);
    color:#ff1717 !important;

    font-size:27px;

    transition:
        transform .35s ease,
        background .35s ease,
        color .35s ease;
}

.service-premium-card:hover > i{
    transform:rotate(-5deg) scale(1.08);
    background:#ff1717;
    color:#ffffff !important;
}


/* TEXTOS */

.service-premium-card h3{
    margin:0 0 15px;

    color:#ffffff !important;
    font-size:23px;
    font-weight:800;
}

.service-premium-card p{
    margin:0 0 26px;

    color:#b8b8b8 !important;
    font-size:15px;
    line-height:1.75;
}


/* ENLACE */

.service-premium-card a{
    display:inline-flex;
    align-items:center;
    gap:9px;

    color:#ff1717 !important;
    font-weight:800;
    text-decoration:none;

    transition:
        color .3s ease,
        gap .3s ease;
}

.service-premium-card a:hover{
    color:#ffffff !important;
    gap:14px;
}

.service-premium-card a i{
    font-size:13px;
    transition:transform .3s ease;
}

.service-premium-card a:hover i{
    transform:translateX(4px);
}


/* RESPONSIVE */

@media(max-width:1000px){

    .services-page-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }

}

@media(max-width:650px){

    .services-page{
        padding:80px 0;
    }

    .services-page-grid{
        grid-template-columns:1fr;
    }

    .service-premium-card{
        min-height:auto;
        padding:28px 24px;
    }

}
/*=========================================
        CONTACT PAGE — PREMIUM DARK
=========================================*/

.contact-page{
    padding:110px 0;
    background:#070707 !important;
    color:#ffffff;
}

.contact-page-grid{
    display:grid;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
    align-items:start;
    gap:55px;
}


/* INFORMACIÓN */

.contact-information{
    padding:25px 0;
}

.contact-label{
    display:inline-block;
    margin-bottom:16px;

    color:#ff1717 !important;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.contact-information h2{
    max-width:570px;
    margin:0 0 22px;

    color:#ffffff !important;
    font-size:clamp(40px,5vw,62px);
    font-weight:800;
    line-height:1.08;
}

.contact-intro{
    max-width:610px;
    margin:0 0 42px;

    color:#aeb4bf !important;
    font-size:17px;
    line-height:1.8;
}


/* DETALLES */

.contact-details{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.contact-detail{
    display:flex;
    align-items:center;
    gap:18px;

    padding:19px 20px;

    border:1px solid rgba(255,255,255,.08);
    border-radius:17px;

    background:#121212 !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease;
}

.contact-detail:hover{
    transform:translateX(7px);
    border-color:rgba(255,23,23,.65);
    background:#171717 !important;
}

.contact-detail > i{
    width:50px;
    height:50px;

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

    border-radius:15px;

    background:rgba(255,23,23,.10);
    color:#ff1717 !important;

    font-size:20px;
}

.contact-detail span{
    display:block;
    margin-bottom:5px;

    color:#8f96a3 !important;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.7px;
}

.contact-detail a,
.contact-detail p{
    margin:0;

    color:#ffffff !important;
    font-size:15px;
    font-weight:700;
    line-height:1.5;
    text-decoration:none;
    overflow-wrap:anywhere;
}

.contact-detail a:hover{
    color:#ff1717 !important;
}


/* REDES */

.contact-socials{
    display:flex;
    flex-wrap:wrap;
    gap:12px;

    margin-top:30px;
}

.contact-socials a{
    width:48px;
    height:48px;

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

    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;

    background:#121212;
    color:#ffffff !important;

    font-size:18px;
    text-decoration:none;

    transition:
        transform .3s ease,
        background .3s ease,
        border-color .3s ease;
}

.contact-socials a:hover{
    transform:translateY(-5px);
    background:#ff1717;
    border-color:#ff1717;
}


/* FORMULARIO */

.contact-form-card{
    padding:38px;

    border:1px solid rgba(255,255,255,.09);
    border-radius:26px;

    background:
        linear-gradient(
            145deg,
            #171717 0%,
            #101010 100%
        ) !important;

    box-shadow:
        0 28px 70px rgba(0,0,0,.35);
}

.contact-form-card h2{
    margin:0 0 10px;

    color:#ffffff !important;
    font-size:32px;
    font-weight:800;
}

.contact-form-card > p{
    margin:0 0 30px;

    color:#aeb4bf !important;
    line-height:1.7;
}

.contact-form{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.contact-form .form-row{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:18px;
}

.contact-form .form-group{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.contact-form label{
    color:#ffffff !important;
    font-size:13px;
    font-weight:800;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
    width:100%;
    box-sizing:border-box;

    border:1px solid rgba(255,255,255,.13);
    border-radius:14px;
    outline:none;

    background:#1b1b1b !important;
    color:#ffffff !important;

    font-family:inherit;
    font-size:14px;

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.contact-form input,
.contact-form select{
    height:54px;
    padding:0 16px;
}

.contact-form textarea{
    min-height:150px;
    padding:16px;
    resize:vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
    color:#818181 !important;
}

.contact-form select option{
    background:#1b1b1b;
    color:#ffffff;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
    border-color:#ff1717;
    background:#202020 !important;

    box-shadow:
        0 0 0 4px rgba(255,23,23,.10);
}


/* BOTÓN */

.contact-submit{
    min-height:56px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;

    padding:14px 25px;

    border:0;
    border-radius:15px;
    cursor:pointer;

    background:#ff1717 !important;
    color:#ffffff !important;

    font-family:inherit;
    font-size:16px;
    font-weight:800;

    box-shadow:
        0 14px 32px rgba(255,23,23,.24);

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}

.contact-submit:hover{
    transform:translateY(-3px);
    background:#d90000 !important;

    box-shadow:
        0 20px 42px rgba(255,23,23,.35);
}

.contact-submit i{
    transition:transform .3s ease;
}

.contact-submit:hover i{
    transform:translateX(5px);
}


/* RESPONSIVE */

@media(max-width:950px){

    .contact-page-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:650px){

    .contact-page{
        padding:80px 0;
    }

    .contact-form-card{
        padding:27px 20px;
    }

    .contact-form .form-row{
        grid-template-columns:1fr;
    }

    .contact-information h2{
        font-size:41px;
    }

}
/*=========================================
    CONTACT PAGE — FINAL LEFT CARD FIX
=========================================*/

.contact-page .contact-information{
    background:#111111 !important;
    color:#ffffff !important;

    padding:38px !important;

    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:26px !important;

    box-shadow:0 28px 70px rgba(0,0,0,.35) !important;

    height:auto !important;
    min-height:0 !important;
}


/* TÍTULO */

.contact-page .contact-information h2{
    display:block !important;

    margin:0 0 22px !important;

    color:#ffffff !important;

    font-size:clamp(38px,4vw,58px) !important;
    font-weight:800 !important;
    line-height:1.08 !important;

    opacity:1 !important;
    visibility:visible !important;
}


/* ETIQUETA ROJA */

.contact-page .contact-label{
    display:inline-block !important;

    margin-bottom:16px !important;

    color:#ff1717 !important;

    font-size:13px !important;
    font-weight:800 !important;
    letter-spacing:2px !important;

    opacity:1 !important;
}


/* PÁRRAFO */

.contact-page .contact-intro{
    margin:0 0 34px !important;

    color:#aeb4bf !important;

    font-size:16px !important;
    line-height:1.75 !important;

    opacity:1 !important;
}


/* TARJETAS DE CONTACTO */

.contact-page .contact-detail{
    background:#181818 !important;
    color:#ffffff !important;

    border:1px solid rgba(255,255,255,.09) !important;
}

.contact-page .contact-detail span{
    color:#969daa !important;
}

.contact-page .contact-detail a,
.contact-page .contact-detail p{
    color:#ffffff !important;
}


/* REDES ABAJO */

.contact-page .contact-socials a{
    background:#181818 !important;
    color:#ffffff !important;

    border:1px solid rgba(255,255,255,.12) !important;
}
/*=========================================
        ABOUT PAGE — PREMIUM DARK
=========================================*/

.about-page{
    padding:110px 0;
    background:#070707 !important;
    color:#ffffff;
}

.about-page-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    align-items:center;
    gap:65px;
}


/* IMAGEN */

.about-page-image{
    position:relative;
}

.about-page-image img{
    width:100%;
    min-height:520px;

    display:block;
    object-fit:cover;

    border-radius:26px;
    border:1px solid rgba(255,255,255,.08);

    box-shadow:
        0 28px 70px rgba(0,0,0,.40);
}


/* CAJA DE EXPERIENCIA */

.experience-box{
    position:absolute;
    right:-20px;
    bottom:28px;

    min-width:180px;
    padding:22px 24px;

    border:1px solid rgba(255,255,255,.10);
    border-radius:20px;

    background:
        linear-gradient(
            145deg,
            #ff1717 0%,
            #9f0000 100%
        ) !important;

    color:#ffffff;

    box-shadow:
        0 20px 50px rgba(255,23,23,.26);
}

.experience-box strong{
    display:block;

    color:#ffffff !important;
    font-size:42px;
    font-weight:900;
    line-height:1;
}

.experience-box span{
    display:block;
    margin-top:8px;

    color:rgba(255,255,255,.85) !important;
    font-size:13px;
    font-weight:700;
}


/* CONTENIDO */

.about-page-content{
    padding:20px 0;
}

.about-page-label{
    display:inline-block;
    margin-bottom:16px;

    color:#ff1717 !important;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.about-page-content h2{
    margin:0 0 24px;

    color:#ffffff !important;
    font-size:clamp(42px,5vw,64px);
    font-weight:800;
    line-height:1.08;
}

.about-page-content > p{
    margin:0 0 20px;

    color:#aeb4bf !important;
    font-size:16px;
    line-height:1.85;
}


/* VALORES */

.about-values{
    display:flex;
    flex-direction:column;
    gap:16px;

    margin-top:34px;
}

.about-values > div{
    display:flex;
    align-items:flex-start;
    gap:18px;

    padding:20px;

    border:1px solid rgba(255,255,255,.08);
    border-radius:18px;

    background:#121212 !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease;
}

.about-values > div:hover{
    transform:translateX(8px);
    border-color:rgba(255,23,23,.65);
    background:#171717 !important;
}

.about-values > div > i{
    width:52px;
    height:52px;

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

    border-radius:15px;

    background:rgba(255,23,23,.10);
    color:#ff1717 !important;

    font-size:21px;
}

.about-values h3{
    margin:0 0 7px;

    color:#ffffff !important;
    font-size:18px;
    font-weight:800;
}

.about-values p{
    margin:0;

    color:#aeb4bf !important;
    font-size:14px;
    line-height:1.6;
}


/* RESPONSIVE */

@media(max-width:950px){

    .about-page-grid{
        grid-template-columns:1fr;
    }

    .about-page-image img{
        min-height:430px;
    }

    .experience-box{
        right:20px;
    }

}

@media(max-width:650px){

    .about-page{
        padding:80px 0;
    }

    .about-page-image img{
        min-height:340px;
    }

    .experience-box{
        position:relative;
        right:auto;
        bottom:auto;

        width:100%;
        margin-top:18px;

        box-sizing:border-box;
    }

    .about-page-content h2{
        font-size:40px;
    }

}
/*=========================================
    VEHICLES PAGE — FINAL CARD FIX
=========================================*/

.car-card.modern-card{
    background:#111111 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    border-radius:24px !important;
    overflow:hidden;

    box-shadow:0 20px 50px rgba(0,0,0,.30);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.car-card.modern-card:hover{
    transform:translateY(-9px);
    border-color:#ff1717 !important;
    box-shadow:0 28px 70px rgba(255,23,23,.20);
}


/* FOTO */

.car-card.modern-card .car-slider{
    overflow:hidden;
}

.car-card.modern-card .car-slide{
    transition:transform .65s ease;
}

.car-card.modern-card:hover .car-slide.active{
    transform:scale(1.06);
}


/* INFORMACIÓN GENERAL */

.car-card.modern-card .car-info{
    background:#111111 !important;
    color:#ffffff !important;
}

.car-card.modern-card h3,
.car-card.modern-card h4{
    color:#ffffff !important;
}

.car-card.modern-card .car-subtitle{
    color:#b8b8b8 !important;
}


/* RATING */

.car-card.modern-card .rating{
    background:#fff4d7 !important;
    color:#111827 !important;
    border-radius:14px;
}

.car-card.modern-card .rating i{
    color:#ffb400 !important;
}

.car-card.modern-card .rating span{
    color:#111827 !important;
    font-weight:800;
}


/* CAJAS DE CARACTERÍSTICAS */

.car-card.modern-card .car-features{
    border-color:rgba(255,255,255,.10) !important;
}

.car-card.modern-card .car-features > div{
    background:#f5f5f5 !important;
    border:1px solid rgba(255,23,23,.28) !important;
    color:#111827 !important;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease;
}

.car-card.modern-card .car-features > div:hover{
    transform:translateY(-4px);
    background:#ffffff !important;
    border-color:#ff1717 !important;
}

.car-card.modern-card .car-features i{
    color:#ff1717 !important;
}

.car-card.modern-card .car-features span{
    color:#111827 !important;
    font-weight:700;
}


/* PRECIO */

.car-card.modern-card .modern-price > span{
    color:#9fa5af !important;
}

.car-card.modern-card .modern-price h4{
    color:#ffffff !important;
}

.car-card.modern-card .modern-price small{
    color:#b8b8b8 !important;
}


/* BADGES */

.car-card.modern-card .category{
    background:rgba(10,10,10,.88) !important;
    color:#ffffff !important;
}

.car-card.modern-card .car-badge{
    background:#ff1717 !important;
    color:#ffffff !important;
}


/* BOTONES */

.car-card.modern-card .car-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.car-card.modern-card .reserve-btn{
    background:transparent !important;
    color:#ffffff !important;
    border:1px solid #ff1717 !important;
}

.car-card.modern-card .reserve-btn:hover{
    background:#ff1717 !important;
    color:#ffffff !important;
    transform:translateY(-3px);
}

.car-card.modern-card .details-btn{
    background:#ff1717 !important;
    color:#ffffff !important;
    border:1px solid #ff1717 !important;
}

.car-card.modern-card .details-btn:hover{
    background:#ffffff !important;
    color:#ff1717 !important;
    border-color:#ffffff !important;
    transform:translateY(-3px);
}


/* FLECHAS DEL SLIDER */

.car-card.modern-card .slider-btn{
    background:rgba(0,0,0,.60) !important;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.20) !important;
}

.car-card.modern-card .slider-btn:hover{
    background:#ff1717 !important;
    border-color:#ff1717 !important;
}


/* RESPONSIVE */

@media(max-width:650px){

    .car-card.modern-card .car-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .car-card.modern-card .reserve-btn,
    .car-card.modern-card .details-btn{
        width:100%;
        text-align:center;
    }

}
/*=========================================
   VEHICLE CARD ACTIONS — OVERFLOW FIX
=========================================*/

.car-card.modern-card .car-bottom{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:18px !important;
    flex-wrap:wrap !important;
}

.car-card.modern-card .modern-price{
    flex:1 1 120px;
    min-width:110px;
}

.car-card.modern-card .car-actions{
    display:flex !important;
    flex:1 1 210px;
    justify-content:flex-end !important;
    gap:10px !important;
    flex-wrap:wrap !important;
    min-width:0 !important;
}

.car-card.modern-card .reserve-btn,
.car-card.modern-card .details-btn{
    flex:1 1 105px;
    min-width:0 !important;
    max-width:100% !important;

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

    padding:12px 14px !important;
    box-sizing:border-box !important;

    white-space:nowrap;
    text-align:center;
    font-size:13px !important;
}

/* En tarjetas más estrechas, botones uno debajo del otro */

@media(max-width:1200px){

    .car-card.modern-card .car-actions{
        flex-basis:100%;
        justify-content:stretch !important;
    }

    .car-card.modern-card .reserve-btn,
    .car-card.modern-card .details-btn{
        flex:1 1 calc(50% - 5px);
    }

}

@media(max-width:650px){

    .car-card.modern-card .car-bottom{
        align-items:stretch !important;
    }

    .car-card.modern-card .car-actions{
        flex-direction:column;
    }

    .car-card.modern-card .reserve-btn,
    .car-card.modern-card .details-btn{
        width:100% !important;
        flex:none;
    }

}
/*=========================================
   VEHICLE FEATURES — OVERFLOW FIX
=========================================*/

.car-card.modern-card .car-features{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    gap:10px !important;

    width:100% !important;
    max-width:100% !important;

    box-sizing:border-box !important;
}

.car-card.modern-card .car-features > div{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    padding:13px 7px !important;

    box-sizing:border-box !important;

    text-align:center !important;

    overflow:hidden !important;
}

.car-card.modern-card .car-features span{
    display:block !important;

    width:100% !important;
    min-width:0 !important;

    font-size:12px !important;
    line-height:1.25 !important;

    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
}

.car-card.modern-card .car-features i{
    display:block !important;
    margin:0 auto 8px !important;
}


/* En tarjetas estrechas: 2 por fila */

@media(max-width:1200px){

    .car-card.modern-card .car-features{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }

}


/* En celular pueden mantenerse 2 por fila */

@media(max-width:500px){

    .car-card.modern-card .car-features{
        gap:8px !important;
    }

    .car-card.modern-card .car-features > div{
        padding:12px 8px !important;
    }

}
/*=========================================
   VEHICLE FEATURE TEXT — WORD FIX
=========================================*/

.car-card.modern-card .car-features span{
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;

    font-size:11px !important;
    line-height:1.2 !important;

    white-space:normal !important;
}

.car-card.modern-card .car-features > div{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    min-height:76px !important;
    overflow:visible !important;
}

/* Un poco más de espacio para textos largos */

.car-card.modern-card .car-features{
    gap:8px !important;
}

/* En tarjetas más estrechas, 2 cajas por fila para evitar cortes */

@media(max-width:1100px){

    .car-card.modern-card .car-features{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }

    .car-card.modern-card .car-features span{
        font-size:12px !important;
    }

}
/*=========================================
      HOME FLEET — PREMIUM CARDS
=========================================*/

.home-fleet-card{
    background:#121212 !important;
    border:1px solid rgba(255,255,255,.08) !important;
    border-radius:22px !important;
    overflow:hidden;

    box-shadow:0 20px 50px rgba(0,0,0,.30);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.home-fleet-card:hover{
    transform:translateY(-8px);
    border-color:#ff1717 !important;
    box-shadow:0 28px 65px rgba(255,23,23,.18);
}

.home-fleet-card .car-image{
    overflow:hidden;
}

.home-fleet-card .car-image img{
    width:100%;
    height:270px;
    object-fit:cover;

    transition:transform .6s ease;
}

.home-fleet-card:hover .car-image img{
    transform:scale(1.06);
}

.home-fleet-card .car-info{
    background:#121212 !important;
    color:#ffffff !important;
}

.home-fleet-card h3{
    color:#ffffff !important;
}

.home-fleet-card p{
    color:#b8b8b8 !important;
}

.home-fleet-card ul{
    display:grid;
    gap:10px;
}

.home-fleet-card li{
    color:#d7d7d7 !important;
}

.home-fleet-card li i{
    color:#ff1717 !important;
}

.home-fleet-card .price h4{
    color:#ffffff !important;
}

.home-fleet-card .price span{
    color:#aeb4bf !important;
}

.home-fleet-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.home-fleet-actions .btn-small,
.home-details-btn{
    min-height:42px;

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

    padding:10px 16px;
    border-radius:999px;

    font-size:13px;
    font-weight:800;
    text-decoration:none;
}

.home-fleet-actions .btn-small{
    background:#ff1717 !important;
    color:#ffffff !important;
    border:1px solid #ff1717 !important;
}

.home-details-btn{
    background:transparent;
    color:#ffffff !important;
    border:1px solid rgba(255,255,255,.35);
}

.home-details-btn:hover{
    background:#ffffff;
    color:#111111 !important;
}
/*=========================================
   HOME FLEET — 4 COLUMNS + BUTTON SPACING
=========================================*/

.home-fleet-grid{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:22px !important;
    align-items:stretch !important;
}

.home-fleet-card{
    height:100%;
    display:flex;
    flex-direction:column;
}

.home-fleet-card .car-info{
    flex:1;
    display:flex;
    flex-direction:column;
}

.home-fleet-card .price{
    margin-top:auto !important;
    padding-top:22px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:16px !important;
}

.home-fleet-card .price h4{
    margin:0 !important;
}

.home-fleet-actions{
    width:100% !important;

    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;

    margin-top:4px !important;
}

.home-fleet-actions .btn-small,
.home-details-btn{
    width:100% !important;
    min-height:42px !important;

    padding:10px 12px !important;

    box-sizing:border-box !important;
    white-space:nowrap !important;
}


/* TABLET */

@media(max-width:1100px){

    .home-fleet-grid{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }

}


/* CELULAR */

@media(max-width:650px){

    .home-fleet-grid{
        grid-template-columns:1fr !important;
    }

    .home-fleet-actions{
        grid-template-columns:1fr !important;
    }

}

.payment-secure-note {
    margin-top: 18px;
    color: #555555;
    font-size: 14px;
    line-height: 1.6;
}
/* PAYPAL BUTTON TEXT — FINAL FIX */

#paypal-payment-button {
    background: #ffc439 !important;
    color: #111827 !important;
    border: none !important;
}

#paypal-payment-button #paypal-payment-text,
#paypal-payment-button i {
    color: #111827 !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: none !important;
}

#paypal-payment-button:hover {
    background: #ffb800 !important;
    color: #111827 !important;
}


/* CORPORAN FINAL AUDIT 2026 */
.footer-logo-image{width:58px;height:58px;object-fit:contain;flex:0 0 auto}.footer-logo span{font-size:20px;line-height:1.2}.footer-email-link{word-break:break-word}.footer-contact a,.footer-contact p{display:flex;align-items:flex-start;gap:8px;line-height:1.5}.footer-top{align-items:start}.main-footer{overflow:hidden}
.google-review-panel{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;padding:38px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:#141414;box-shadow:0 20px 50px rgba(0,0,0,.28)}.google-review-icon{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:34px}.google-review-copy h3{color:#fff;margin:8px 0}.google-review-copy p{color:#b8b8b8;max-width:700px;line-height:1.7}.google-review-stars{color:#ffb800;letter-spacing:3px}.google-review-button{white-space:nowrap}
.vehicles-grid{width:min(1440px,calc(100% - 40px));margin-inline:auto;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:28px!important}.vehicles-grid .modern-card{min-width:0!important;width:100%!important}.vehicles-grid .modern-card .car-info,.vehicles-grid .modern-card .car-top h3,.vehicles-grid .modern-card .car-subtitle,.vehicles-grid .modern-card .car-features span{color:#f3f4f6!important}.vehicles-grid .modern-card .car-subtitle,.vehicles-grid .modern-card .car-features span{color:#b9c0ca!important}.vehicles-grid .modern-card .modern-price>span{color:#b9c0ca!important}
.premium-gallery-item img{width:100%;height:100%;object-fit:cover}
@media(max-width:1180px){.vehicles-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.google-review-panel{grid-template-columns:auto 1fr}.google-review-button{grid-column:1/-1;justify-self:start}}
@media(max-width:700px){.vehicles-grid{width:min(100% - 24px,560px);grid-template-columns:1fr!important}.google-review-panel{grid-template-columns:1fr;padding:26px}.google-review-icon{width:60px;height:60px}.google-review-button{width:100%;text-align:center;white-space:normal}.footer-logo span{font-size:18px}}


/* TÍTULOS DE FLEET SOBRE FONDO OSCURO */

.fleet .section-title h2 {
    color: #ffffff !important;
}

.fleet .section-title p {
    color: #b8c1d1 !important;
}

/*==========================================
   V66 - RESPONSIVE ESTABILIZADO CORPORAN
   Sustituye los parches V65/V65.2 anteriores
==========================================*/

/* Texto de las características dentro de cajas blancas */
.vehicles-grid .modern-card .car-features > div {
    color: #111827 !important;
    background: #f8fafc !important;
}

.vehicles-grid .modern-card .car-features > div span {
    color: #111827 !important;
    font-weight: 700 !important;
}

.vehicles-grid .modern-card .car-features > div i {
    color: #ff1717 !important;
}

@media (max-width: 991px) {
    .about-page-grid,
    .about .container,
    .contact-grid,
    .booking-form {
        grid-template-columns: 1fr;
    }

    .footer-top,
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .container {
        width: calc(100% - 28px);
        max-width: 100%;
        margin-inline: auto;
    }

    .page-banner {
        padding: 130px 0 70px;
        text-align: center;
    }

    .page-banner h1 {
        font-size: 34px;
        line-height: 1.2;
    }

    .page-banner p {
        font-size: 16px;
    }

    /* MENÚ MÓVIL REAL: .navbar + clase .active de script.js */
    .header .container {
        position: relative;
    }

    .navbar {
        display: block !important;
        position: absolute !important;
        top: calc(100% + 14px) !important;
        left: 0 !important;
        width: 100% !important;
        padding: 22px !important;
        border: 1px solid rgba(255,255,255,.10);
        border-radius: 18px;
        background: rgba(8,16,31,.97) !important;
        box-shadow: 0 22px 55px rgba(0,0,0,.35);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-14px) scale(.98);
        transition: opacity .28s ease, transform .28s ease, visibility .28s ease;
        z-index: 1100;
    }

    .navbar.active {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0) scale(1);
    }

    .navbar ul,
    .navbar.active ul {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
    }

    .navbar ul li {
        opacity: 0;
        transform: translateY(-6px);
        transition: opacity .22s ease, transform .22s ease;
    }

    .navbar.active ul li {
        opacity: 1;
        transform: translateY(0);
    }

    .navbar.active ul li:nth-child(1) { transition-delay: .03s; }
    .navbar.active ul li:nth-child(2) { transition-delay: .06s; }
    .navbar.active ul li:nth-child(3) { transition-delay: .09s; }
    .navbar.active ul li:nth-child(4) { transition-delay: .12s; }
    .navbar.active ul li:nth-child(5) { transition-delay: .15s; }
    .navbar.active ul li:nth-child(6) { transition-delay: .18s; }
    .navbar.active ul li:nth-child(7) { transition-delay: .21s; }

    .navbar a {
        display: block;
        width: 100%;
        padding: 12px 14px;
        border-radius: 10px;
    }

    .navbar a:hover,
    .navbar a.active {
        background: rgba(255,23,23,.12);
    }

    /* VEHÍCULOS */
    .fleet-grid,
    .vehicles-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .vehicles-grid {
        width: calc(100% - 24px) !important;
        margin-inline: auto !important;
    }

    .vehicles-grid .modern-card {
        width: 100% !important;
        min-width: 0 !important;
    }

    .vehicles-grid .modern-card .car-info {
        padding: 22px !important;
    }

    /* GALERÍA: una sola foto por fila */
    .gallery-page .container {
        width: calc(100% - 28px) !important;
    }

    .premium-gallery-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-rows: auto !important;
        gap: 20px !important;
        width: 100% !important;
    }

    .premium-gallery-grid .premium-gallery-item {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 300px !important;
    }

    .premium-gallery-grid .premium-gallery-item img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* RESERVA: eliminar desborde horizontal */
    .reservation-page {
        padding: 65px 0 !important;
    }

    .reservation-page > .reservation-layout {
        width: calc(100% - 28px) !important;
        max-width: 100% !important;
        margin-inline: auto !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 26px !important;
        min-width: 0 !important;
    }

    .reservation-form-area,
    .reservation-summary,
    .premium-reservation-form,
    .form-row,
    .form-group {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .reservation-form-area,
    .reservation-summary {
        padding: 24px 18px !important;
        margin: 0 !important;
    }

    .reservation-summary {
        position: relative !important;
        top: auto !important;
    }

    .form-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .summary-vehicle,
    .summary-lines > div,
    .summary-price-breakdown > div,
    .summary-total,
    .payment-choice-card,
    .pending-balance-line {
        min-width: 0 !important;
    }

    .summary-lines strong,
    .summary-price-breakdown strong,
    .payment-choice-content,
    .payment-choice-price {
        min-width: 0 !important;
        overflow-wrap: anywhere;
    }

    /* FOOTER */
    .footer-top,
    .footer-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    /* BOTONES FLOTANTES REALES */
    .back-top {
        right: 18px !important;
        bottom: 92px !important;
        width: 48px !important;
        height: 48px !important;
    }

    .whatsapp-float {
        right: 18px !important;
        bottom: 20px !important;
        width: 56px !important;
        height: 56px !important;
    }
}

@media (max-width: 480px) {
    .premium-gallery-grid .premium-gallery-item {
        height: 270px !important;
    }

    .reservation-form-area h2 {
        font-size: 30px !important;
    }

    .summary-vehicle {
        align-items: flex-start;
    }

    .summary-vehicle img {
        width: 96px;
        height: 76px;
        flex: 0 0 auto;
    }
}

/* ==========================
   LEGAL PAGES
========================== */

.legal-page{
    padding:80px 0;
    background:#0b0b0b;
}

.legal-page .container{
    max-width:900px;
}

.legal-page h2{
    font-size:2.2rem;
    color:#fff;
    margin-bottom:20px;
}

.legal-page h3{
    color:var(--primary-color);
    margin-top:40px;
    margin-bottom:12px;
    font-size:1.25rem;
}

.legal-page p{
    color:#cfcfcf;
    line-height:1.9;
    margin-bottom:18px;
}

.legal-page a{
    color:var(--primary-color);
    text-decoration:none;
}

.legal-page a:hover{
    text-decoration:underline;
}

.related-vehicles .vehicle-card {
    background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.related-vehicles .vehicle-card-image {
    width: 100%;
    height: 220px;
    overflow: hidden;
}

.related-vehicles .vehicle-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.related-vehicles .vehicle-card-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.related-vehicles .vehicle-category {
    color: #ff1f1f;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.related-vehicles .vehicle-card h3 {
    color: #0f172a;
    font-size: 22px;
    line-height: 1.2;
    margin: 0 0 10px;
}

.related-vehicles .vehicle-card-price {
    color: #0f172a;
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 18px;
}

.related-vehicles .vehicle-card-price small {
    color: #64748b;
    font-size: 13px;
    font-weight: 500;
}

.related-vehicles .vehicle-card-actions {
    display: flex;
    gap: 10px;
    margin-top: auto;
}

.related-vehicles .vehicle-card-actions a {
    flex: 1;
    text-align: center;
}

.related-vehicles .related-grid {
    align-items: stretch;
}
.related-vehicles .vehicle-card-actions .btn-outline {
    color: #111827 !important;
    background: transparent;
    border: 1px solid #d1d5db;
}

.related-vehicles .vehicle-card-actions .btn-outline:hover {
    color: #ffffff !important;
    background: #111827;
    border-color: #111827;
}

.reservation-success-page {
    min-height: 75vh;
    padding: 140px 20px 90px;
    background:
        radial-gradient(circle at top, rgba(220, 20, 30, 0.14), transparent 42%),
        #080b12;
    display: flex;
    align-items: center;
    justify-content: center;
}

.reservation-success-card {
    width: min(720px, 100%);
    padding: 55px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 28px;
    background: rgba(13, 18, 28, 0.96);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    text-align: center;
    color: #fff;
}

.reservation-success-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #e3131b;
    font-size: 42px;
    font-weight: 800;
}

.reservation-success-label {
    margin-bottom: 10px;
    color: #e3131b;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
}

.reservation-success-card h1 {
    margin-bottom: 18px;
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1.05;
}

.reservation-success-card > p {
    max-width: 580px;
    margin: 0 auto 26px;
    color: #aeb8c8;
    line-height: 1.7;
}

.reservation-success-code {
    margin: 30px 0;
    padding: 22px;
    border-radius: 18px;
    background: #080b12;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.reservation-success-code span {
    display: block;
    margin-bottom: 8px;
    color: #8c97a8;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.reservation-success-code strong {
    color: #fff;
    font-size: clamp(1.35rem, 4vw, 2rem);
    letter-spacing: 0.06em;
}

.reservation-success-actions {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .reservation-success-page {
        padding: 110px 16px 60px;
    }

    .reservation-success-card {
        padding: 36px 22px;
    }

    .reservation-success-actions a {
        width: 100%;
    }
}