/* =========================================================
   QUICK TRAVEL PLANNER
========================================================= */

.travel-planner{

position:relative;

margin-top:-80px;

z-index:20;

}

.planner-card{

background:white;

border-radius:28px;

padding:40px;

box-shadow:
0 30px 70px rgba(0,0,0,.12);

}

.planner-title{

text-align:center;

margin-bottom:35px;

}

.planner-title h2{

font-size:2.2rem;

margin-bottom:10px;

color:var(--dark);

}

.planner-title p{

color:var(--text-light);

margin:0;

}

.planner-form{

display:grid;

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

gap:20px;

align-items:end;

}

.field{

display:flex;

flex-direction:column;

gap:10px;

}

.field label{

font-size:.95rem;

font-weight:600;

color:var(--dark);

}

.field input,
.field select{

height:60px;

padding:0 18px;

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

border-radius:14px;

font-size:16px;

transition:.3s;

background:white;

}

.field input:focus,
.field select:focus{

outline:none;

border-color:var(--primary);

box-shadow:
0 0 0 4px rgba(31,59,147,.08);

}

.planner-btn{

height:60px;

border:none;

background:var(--accent);

color:white;

border-radius:14px;

font-size:16px;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.planner-btn:hover{

background:var(--accent-dark);

transform:translateY(-3px);

}

@media(max-width:1100px){

.planner-form{

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

}

}

@media(max-width:700px){

.travel-planner{

margin-top:-30px;

}

.planner-card{

padding:25px;

}

.planner-form{

grid-template-columns:1fr;

}

}
/* ==========================================
HOME SERVICES
========================================== */

.services-home{
    background:#fff;
}

.service-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center;
    margin-bottom:120px;
}

.service-row:last-child{
    margin-bottom:0;
}

.service-row.reverse .service-image{
    order:2;
}

.service-row.reverse .service-content{
    order:1;
}

.service-image{
    border-radius:28px;
    overflow:hidden;
    box-shadow:var(--shadow-lg);
    height:520px;
}

.service-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.8s;
}

.service-row:hover .service-image img{
    transform:scale(1.06);
}

.service-content h2{
    margin:20px 0;
}

.service-content p{
    color:var(--text-light);
    margin-bottom:30px;
}

.service-features{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
    margin-bottom:35px;
}

.service-features div{
    background:#F8FAFC;
    padding:16px 18px;
    border-radius:14px;
    font-weight:500;
    border:1px solid var(--border);
    transition:.3s;
}

.service-features div:hover{
    border-color:var(--primary);
    transform:translateY(-4px);
}

@media(max-width:992px){

    .service-row{
        grid-template-columns:1fr;
        gap:40px;
        margin-bottom:80px;
    }

    .service-row.reverse .service-image,
    .service-row.reverse .service-content{
        order:initial;
    }

    .service-image{
        height:350px;
    }

    .service-features{
        grid-template-columns:1fr;
    }

}