/* Ahmedabad Airport Cab — shared route-page template styles
   Linked from every *-taxi.html page. Adds the structure introduced
   from the Moksh Travel reference: hero + side booking card, a real
   fare table, a "why choose us" icon grid, tag-pill lists, a quote
   request modal with a success confirmation and toast notices. */

/* ---------- Hero: two-column (content + booking card) ---------- */
.hero-grid-2{position:relative;display:grid;grid-template-columns:1fr 380px;gap:32px;align-items:start}
.hero-left .hero-intro{margin-top:18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hero-left .hero-actions{margin-top:24px}
.hero-book-card{position:sticky;top:96px}
.hero-book-card .route-booking{padding:22px;border-radius:24px}
.hero-book-card .route-booking-head{margin-bottom:14px;flex-direction:column;align-items:flex-start;gap:10px}
.hero-book-card .route-booking-head h2{font-size:20px}
.hero-book-card .package-pill{white-space:normal;width:100%;justify-content:space-between}
.hero-book-card .package-pill strong{font-size:22px}
.hero-book-card .route-booking-form{grid-template-columns:1fr!important;gap:10px!important}
.hero-book-card .book-now{width:100%}
.hero-call-link{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;width:100%}
@media(max-width:980px){
  .hero-grid-2{grid-template-columns:1fr}
  .hero-book-card{position:static}
}

/* ---------- Route overview info strip ---------- */
.overview-3{grid-template-columns:repeat(3,1fr)!important}
@media(max-width:680px){.overview-3{grid-template-columns:1fr 1fr!important}}

/* ---------- Fare table (rich-data routes) ---------- */
.fare-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:19px;background:#fff;box-shadow:0 14px 40px rgba(51,31,90,.06)}
.route-fare-table{width:100%;border-collapse:collapse;min-width:520px}
.route-fare-table th{background:linear-gradient(135deg,var(--purple),var(--blue));color:#fff;text-align:left;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:15px 18px;white-space:nowrap}
.route-fare-table td{padding:15px 18px;font-size:13.5px;color:#3b3a4d;border-top:1px solid var(--line);white-space:nowrap}
.route-fare-table td.fare-amt{color:#7a32dc;font-weight:800;font-family:Manrope,Inter,sans-serif;font-size:16px}
.route-fare-table td.fare-dist{color:#1c9a71;font-weight:700}
.route-fare-table td:first-child{color:var(--ink);font-weight:800}
@media(max-width:700px){
  .fare-table-wrap{overflow:visible;border:1px solid var(--line);background:#fff;box-shadow:0 10px 28px rgba(51,31,90,.05)}
  .route-fare-table{width:100%;min-width:0;table-layout:fixed}
  .route-fare-table th{padding:9px 5px;font-size:9.5px;line-height:1.25;white-space:normal;word-break:break-word}
  .route-fare-table td{padding:10px 5px;font-size:11.5px;white-space:normal;word-break:break-word}
  .route-fare-table td.fare-amt{font-size:12.5px}
  .route-fare-table th:first-child,.route-fare-table td:first-child{width:26%}
}

/* ---------- Starting-fare panel (sparse-data routes) ---------- */
.fare-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 28px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(135deg,#faf5ff,#f3f7ff)}
.fare-panel strong{font-family:Manrope,Inter,sans-serif;font-size:34px;letter-spacing:-.03em;background:linear-gradient(90deg,#6d24db,#416ff3);-webkit-background-clip:text;background-clip:text;color:transparent}
.fare-panel span{color:#6e6f82;font-size:13px}

/* ---------- Why-choose-us icon grid ---------- */
.why-grid-route{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.why-card-route{padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(51,31,90,.05)}
.why-card-route .icon{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#f0e7ff,#edf3ff);display:grid;place-items:center;font-size:18px}
.why-card-route h4{margin:14px 0 6px;font-size:15px}
.why-card-route p{color:#6c6d7f;font-size:12.5px;line-height:1.6}
@media(max-width:820px){.why-grid-route{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.why-grid-route{grid-template-columns:1fr}}

/* ---------- Tag-pill lists (who can book / more routes) ---------- */
.tag-list-route{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.tag-pill-route{background:var(--soft,#f7f3ff);border:1px solid var(--line);border-radius:30px;padding:9px 16px;font-size:12.5px;font-weight:700;color:#4a4761;transition:.2s}
a.tag-pill-route:hover{border-color:#cbb7eb;color:var(--purple);background:#fff}

/* ---------- FAQ: single column (matches reference) ---------- */
.faq-list-route{display:flex;flex-direction:column;gap:12px;max-width:860px}
.faq-list-route .faq{width:100%}

/* ---------- Quote modal / success modal / toast ---------- */
#routeQuoteModal,#routeSuccessModal{position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;background:rgba(20,14,34,.5);backdrop-filter:blur(4px);padding:20px}
#routeQuoteModal.open,#routeSuccessModal.open{display:flex}
.qm-card{position:relative;width:min(440px,94vw);background:#fff;border-radius:26px;padding:28px 26px 24px;box-shadow:0 40px 100px rgba(30,15,60,.32);max-height:92vh;overflow:auto}
.qm-card .modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:16px;cursor:pointer;color:#4a4a5c}
.qm-card h3{font-family:Manrope,Inter,sans-serif;font-size:22px;letter-spacing:-.03em;margin-bottom:18px}
.qm-card .field{position:relative;background:#fff;border:1.5px solid #ded9e8;border-radius:15px;padding:9px 13px;margin-bottom:12px}
.qm-card .field label{display:block;color:#767689;font-size:10.5px;font-weight:800;margin-bottom:5px}
.qm-card .field input{width:100%;border:0;outline:0;color:#222130;background:none;font-size:14px;font-weight:800}
.qm-row-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.success-card-route{text-align:center;padding:10px}
.success-check-route{width:66px;height:66px;border-radius:50%;background:rgba(28,154,113,.1);border:2px solid rgba(28,154,113,.3);display:grid;place-items:center;margin:0 auto 18px;font-size:28px;color:#1c9a71}
.success-card-route h3{font-family:Manrope,Inter,sans-serif;font-size:20px;margin-bottom:10px}
.success-card-route p{color:#6c6d7f;font-size:13.5px;line-height:1.6}

#routeToast{position:fixed;top:88px;right:18px;left:auto;z-index:410;background:#fff;border:1px solid #f0c9c9;color:#b23c3c;padding:13px 18px;border-radius:12px;font-size:13px;font-weight:700;opacity:0;transform:translateX(24px);transition:.25s ease;pointer-events:none;max-width:300px;box-shadow:0 14px 34px rgba(30,10,10,.14)}
#routeToast.show{opacity:1;transform:translateX(0)}
@media(max-width:520px){#routeToast{left:16px;right:16px;max-width:none}}
