@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --ink:#20242B;
  --ink-soft:#2C313A;
  --ink-line: rgba(32,36,43,0.12);
  --ink-line-dark: rgba(255,255,255,0.14);
  --paper:#FFFFFF;
  --bg:#F4F7F5;
  --amber:#2FB673;
  --amber-dark:#249259;
  --teal:#249259;
  --slate:#5B6470;
  --success:#249259;
  --error:#D6473F;
  --radius:12px;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:'Inter',sans-serif; background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:'Inter',sans-serif; font-weight:800; letter-spacing:-0.02em;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}

.eyebrow{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--teal);}

.container{max-width:1360px; margin:0 auto; padding:0 20px;}
@media(max-width:640px){.container{padding:0 20px;}}

.topbar-row{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:16px;}
.topbar-row .logo{grid-column:2; justify-self:center;}
.topbar-row .support{grid-column:3; justify-self:end; white-space:nowrap;}
@media(max-width:640px){.topbar-row{grid-template-columns:auto 1fr;} .topbar-row .logo{grid-column:1; justify-self:start;} .topbar-row .support{grid-column:2;}}

.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:18px 24px; background:var(--ink); color:#fff;
}
.logo{display:flex; align-items:center; gap:12px; font-weight:900; font-size:32px; flex-shrink:0; letter-spacing:-0.03em; line-height:1;}
.logo-mark{width:42px; height:42px; border-radius:11px; flex-shrink:0; display:block;}
.logo-lg{font-size:44px;}
.logo-lg .logo-mark{width:56px; height:56px; border-radius:15px;}
.logo .dot{color:var(--amber);}
.logo-badge{
  color:#FFC72C;
  font-weight:inherit;
}
.topbar .support{font-family:'JetBrains Mono'; font-size:13px; opacity:.8; white-space:nowrap; flex-shrink:0;}
@media(max-width:640px){
  .topbar{padding:16px 18px;} .topbar .support{display:none;}
  .logo{font-size:26px; gap:9px;} .logo-mark{width:34px; height:34px; border-radius:9px;}
  .logo-lg{font-size:32px;} .logo-lg .logo-mark{width:40px; height:40px; border-radius:11px;}
}

/* ===== Wizard shell ===== */
.wizard{max-width:960px; margin:0 auto; padding:44px 24px 100px;}
.progress{display:flex; gap:8px; margin-bottom:40px;}
.progress .seg{flex:1; height:4px; background:var(--ink-line); border-radius:4px; overflow:hidden;}
.progress .seg.done, .progress .seg.active{background:var(--amber);}
.step-label{display:flex; justify-content:space-between; margin-bottom:10px; font-family:'JetBrains Mono'; font-size:11px; text-transform:uppercase; letter-spacing:0.1em; color:var(--slate);}

.card{background:var(--paper); border:1px solid var(--ink-line); border-radius:var(--radius); padding:32px; box-shadow:0 1px 3px rgba(18,33,59,0.04);}
@media(max-width:640px){.card{padding:22px;}}

.field-row{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px;}
@media(max-width:640px){.field-row{grid-template-columns:1fr;}}
.field label{display:block; font-family:'JetBrains Mono'; font-size:10.5px; text-transform:uppercase; letter-spacing:0.08em; color:var(--slate); margin-bottom:8px;}
.field input, .field select{
  width:100%; padding:13px 14px; border:1.5px solid var(--ink-line); border-radius:var(--radius);
  font-family:'Plus Jakarta Sans'; font-size:15px; background:var(--bg); color:var(--ink); outline:none;
  transition:border-color .15s;
}
.field input:focus, .field select:focus{border-color:var(--amber);}
.field-hint{font-size:12px; color:var(--slate); margin-top:6px;}
.autocomplete-results{
  position:relative;
}
.autocomplete-list{
  position:absolute; top:100%; left:0; right:0; background:var(--paper); border:1.5px solid var(--ink-line);
  border-top:none; max-height:220px; overflow-y:auto; z-index:20; border-radius:0 0 var(--radius) var(--radius);
  box-shadow:0 12px 24px rgba(18,33,59,0.1);
}
.autocomplete-list div{padding:11px 14px; font-size:13.5px; cursor:pointer; border-bottom:1px solid var(--ink-line);}
.autocomplete-list div:hover{background:var(--bg);}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 26px; font-size:14px; font-weight:700; border-radius:var(--radius);
  border:1.5px solid transparent; transition:all .2s;
}
.btn-brass{background:var(--amber); color:var(--ink);}
.btn-brass:hover{background:var(--amber-dark);}
.btn-ink{background:var(--ink); color:#fff;}
.btn-ink:hover{background:var(--ink-soft);}
.btn-outline{border-color:var(--ink-line); background:none; color:var(--ink);}
.btn-outline:hover{border-color:var(--ink);}
.btn:disabled{opacity:.45; cursor:not-allowed;}
.btn-full{width:100%;}

.wizard-actions{display:flex; justify-content:space-between; margin-top:26px;}

/* ===== Trip type toggle ===== */
.trip-type-toggle{display:flex; gap:8px; margin-bottom:20px; background:var(--ink-line); padding:4px; border-radius:var(--radius); width:fit-content;}
.trip-type-toggle button{padding:9px 20px; border-radius:7px; border:none; background:none; font-size:13px; font-weight:600; color:var(--slate);}
.trip-type-toggle button.active{background:var(--paper); color:var(--ink); box-shadow:0 1px 2px rgba(18,33,59,0.08);}

/* ===== Vehicle comparison ===== */
.vehicle-list{display:flex; flex-direction:column; gap:14px;}
.vehicle-card{
  display:grid; grid-template-columns:140px 1fr auto; gap:22px; align-items:center;
  border:1.5px solid var(--ink-line); border-radius:var(--radius); padding:16px; cursor:pointer;
  transition:border-color .15s, background .15s;
}
.vehicle-card:hover{border-color:var(--amber);}
.vehicle-card.selected{border-color:var(--amber); background:#E7F7EF;}
.vehicle-card img{border-radius:7px; width:100%; height:84px; object-fit:contain; background:var(--bg);}
.vehicle-card h3{font-size:17px; margin-bottom:4px; font-weight:700;}
.vehicle-meta{display:flex; gap:14px; font-size:12.5px; color:var(--slate); font-family:'JetBrains Mono';}
.vehicle-price{text-align:right;}
.vehicle-price .amount{font-size:23px; font-weight:800;}
.vehicle-price .label{font-size:11px; color:var(--slate); font-family:'JetBrains Mono';}
@media(max-width:640px){
  .vehicle-card{grid-template-columns:80px 1fr; grid-template-areas:"img title" "img price";}
  .vehicle-card img{grid-area:img; height:60px;}
  .vehicle-price{grid-area:price; text-align:left;}
}

.trip-summary{
  background:var(--ink); color:#fff; border-radius:var(--radius); padding:22px 26px;
  display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; flex-wrap:wrap; gap:14px;
}
.trip-summary .route{font-family:'JetBrains Mono'; font-size:13px; color:rgba(255,255,255,0.8);}
.trip-summary .stats{display:flex; gap:20px; font-family:'JetBrains Mono'; font-size:12.5px; color:var(--amber);}

.availability-msg{padding:12px 16px; border-radius:var(--radius); font-size:13.5px; margin-top:14px; font-weight:500;}
.availability-msg.ok{background:#E4F6EE; color:var(--success);}
.availability-msg.bad{background:#FCEAEA; color:var(--error);}

/* Payment */
#payment-element{margin:20px 0;}
.pay-summary{display:flex; justify-content:space-between; padding:14px 0; border-top:1px solid var(--ink-line); margin-top:10px;}
.pay-summary .total{font-size:22px; font-weight:800;}

/* Confirmation */
.confirm-hero{text-align:center; padding:16px 0 30px;}
.confirm-hero h2{font-size:30px; margin:14px 0 8px;}
.driver-card{display:flex; align-items:center; gap:16px; border:1.5px solid var(--ink-line); border-radius:var(--radius); padding:18px;}
.driver-avatar{width:52px; height:52px; border-radius:50%; background:var(--ink); color:var(--amber); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:17px;}
.trip-status-badge{font-family:'JetBrains Mono'; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; padding:5px 12px; border-radius:20px; background:var(--bg);}

/* ===== Popular destinations ===== */
.dest-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.dest-card{position:relative; border-radius:var(--radius); overflow:hidden; height:170px; display:flex; align-items:flex-end; padding:18px; color:#fff; background-size:cover; background-position:center;}
.dest-card::before{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(32,36,43,0.05) 20%, rgba(32,36,43,0.88) 100%);}
.dest-card .dest-body{position:relative; z-index:1;}
.dest-card .dest-route{font-size:15.5px; font-weight:800; margin-bottom:4px; line-height:1.3;}
.dest-card .dest-price{font-family:'JetBrains Mono'; font-size:12.5px; color:var(--amber);}
.dest-note{font-size:12px; color:var(--slate); margin-top:14px;}
@media(max-width:900px){.dest-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.dest-grid{grid-template-columns:1fr;}}

/* ===== Customer reviews ===== */
.review-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.review-card{background:var(--paper); border:1.5px solid var(--ink-line); border-radius:var(--radius); padding:24px;}
.review-stars{color:var(--amber); font-size:14px; letter-spacing:2px; margin-bottom:14px;}
.review-quote{font-size:14.5px; line-height:1.65; color:var(--ink); margin-bottom:20px;}
.review-person{display:flex; align-items:center; gap:12px;}
.review-avatar{width:38px; height:38px; border-radius:50%; background:var(--ink); color:var(--amber); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex-shrink:0;}
.review-name{font-size:13.5px; font-weight:700;}
.review-meta{font-size:11.5px; color:var(--slate); font-family:'JetBrains Mono';}
@media(max-width:900px){.review-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.review-grid{grid-template-columns:1fr;}}

/* ===== FAQ accordion ===== */
.faq-list{display:flex; flex-direction:column; gap:12px; max-width:760px;}
.faq-item{border:1.5px solid var(--ink-line); border-radius:var(--radius); background:var(--paper); overflow:hidden;}
.faq-q{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; cursor:pointer; font-weight:700; font-size:15px; list-style:none;}
.faq-q::-webkit-details-marker{display:none;}
.faq-q .faq-icon{font-family:'JetBrains Mono'; color:var(--amber-dark); font-size:18px; flex-shrink:0; transition:transform .15s;}
.faq-item[open] .faq-q .faq-icon{transform:rotate(45deg);}
.faq-a{padding:0 22px 20px; font-size:14px; line-height:1.7; color:var(--slate);}

/* ===== "Still have a question" band ===== */
.cta-band-light{background:var(--paper); border:1.5px solid var(--ink-line); border-radius:var(--radius); text-align:center; padding:56px 24px;}
.cta-band-light h2{font-size:clamp(24px,3vw,32px); margin:10px 0 22px;}

/* ===== WhatsApp floating button ===== */
.whatsapp-fab{
  position:fixed; bottom:22px; right:22px; z-index:100; width:58px; height:58px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,0.25);
  transition:transform .15s;
}
.whatsapp-fab:hover{transform:scale(1.06);}
@media(max-width:640px){.whatsapp-fab{width:52px; height:52px; bottom:16px; right:16px;}}

/* ===== Site footer ===== */
.site-footer{background:var(--ink); color:rgba(255,255,255,0.85); padding:60px 0 0; margin-top:0;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; padding-bottom:44px; border-bottom:1px solid var(--ink-line-dark);}
.footer-brand .logo{font-size:26px;}
.footer-brand p{font-size:13.5px; color:rgba(255,255,255,0.6); line-height:1.6; margin:16px 0 20px; max-width:280px;}
.footer-col h4{font-family:'JetBrains Mono'; font-size:11.5px; text-transform:uppercase; letter-spacing:0.1em; color:rgba(255,255,255,0.5); margin-bottom:18px; font-weight:600;}
.footer-col{display:flex; flex-direction:column; gap:13px;}
.footer-col a{font-size:14px; color:rgba(255,255,255,0.85); transition:color .15s;}
.footer-col a:hover{color:var(--amber);}
.social-icons{display:flex; gap:10px;}
.social-icons a{width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.08); border:1px solid var(--ink-line-dark); display:flex; align-items:center; justify-content:center; transition:background .15s;}
.social-icons a:hover{background:var(--amber); }
.social-icons a:hover svg{fill:var(--ink);}
.social-icons svg{fill:rgba(255,255,255,0.85);}
.footer-bottom{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding:22px 0; font-size:12.5px; color:rgba(255,255,255,0.5);}
.footer-bottom .mono{font-family:'JetBrains Mono';}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr; row-gap:32px;} .footer-brand{grid-column:1/-1;}}
@media(max-width:640px){.footer-grid{grid-template-columns:1fr;} .footer-bottom{flex-direction:column; align-items:flex-start;}}