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

.booking-section{

padding:80px 0;

background:#f7f9fc;

}


/*=========================================================
FORM GRID
=========================================================*/

.booking-grid{

display:grid;

grid-template-columns:1.3fr .9fr;

gap:35px;

align-items:start;

}


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

.form-card{

background:#fff;

border-radius:18px;

padding:30px;

margin-bottom:30px;

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

border:1px solid #eef2f7;

transition:.35s;

}

.form-card:hover{

transform:translateY(-5px);

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

}

.form-card h3{

display:flex;

align-items:center;

gap:12px;

font-size:24px;

font-weight:700;

margin-bottom:30px;

color:#003366;

padding-bottom:15px;

border-bottom:1px solid #edf2f7;

}

.form-card h3 i{

width:50px;

height:50px;

background:#0056b3;

color:#fff;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:20px;

}


/*=========================================================
FORM
=========================================================*/

.form-group{

margin-bottom:22px;

}

.form-group label{

display:block;

font-size:15px;

font-weight:600;

margin-bottom:8px;

color:#333;

}

.form-group input,

.form-group textarea,

.form-group select{

width:100%;

height:55px;

padding:0 18px;

border:1px solid #d9e2ec;

border-radius:10px;

font-size:15px;

font-family:inherit;

outline:none;

transition:.30s;

background:#fff;

}

.form-group textarea{

height:120px;

padding:15px 18px;

resize:vertical;

}

.form-group input:focus,

.form-group textarea:focus,

.form-group select:focus{

border-color:#0056b3;

box-shadow:0 0 0 4px rgba(0,86,179,.10);

}


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

.booking-btn{

width:100%;

height:58px;

border:none;

background:#0056b3;

color:#fff;

font-size:17px;

font-weight:600;

border-radius:50px;

cursor:pointer;

transition:.35s;

display:flex;

align-items:center;

justify-content:center;

gap:12px;

margin-top:10px;

}

.booking-btn:hover{

background:#003366;

transform:translateY(-3px);

box-shadow:0 15px 30px rgba(0,86,179,.25);

}


/*=========================================================
PLACEHOLDER
=========================================================*/

::placeholder{

color:#999;

}


/*=========================================================
SELECT
=========================================================*/

select{

cursor:pointer;

}


/*=========================================================
RIGHT CARD STICKY
=========================================================*/

.booking-right{

position:sticky;

top:30px;

}


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

@media(max-width:1100px){

.booking-grid{

grid-template-columns:1fr;

}

.booking-right{

position:relative;

top:0;

}

}

@media(max-width:768px){

.booking-section{

padding:60px 0;

}

.form-card{

padding:25px;

margin-bottom:25px;

}

.form-card h3{

font-size:21px;

}

.form-card h3 i{

width:42px;

height:42px;

font-size:17px;

}

.form-group input,

.form-group textarea,

.form-group select{

height:52px;

font-size:14px;

}

.form-group textarea{

height:110px;

}

.booking-btn{

height:54px;

font-size:16px;

}

}

@media(max-width:480px){

.booking-section{

padding:50px 0;

}

.form-card{

padding:20px;

border-radius:15px;

}

.form-card h3{

font-size:19px;

gap:10px;

}

.form-card h3 i{

width:38px;

height:38px;

font-size:15px;

}

.form-group{

margin-bottom:18px;

}

.form-group label{

font-size:14px;

}

.form-group input,

.form-group textarea,

.form-group select{

padding:0 14px;

font-size:14px;

}

.form-group textarea{

padding:14px;

}

.booking-btn{

height:52px;

font-size:15px;

}

}