/*
 * Homepage v2 — loaded only on the front page (see functions.php enqueue).
 * Extends the real design tokens already defined in style.css:
 *   --cab-primary, --cab-primary-dark, --cab-accent, --cab-dark, --cab-platinum, --cab-radius
 * Every class below is prefixed "cab-home-" so nothing here touches the
 * .cab-hero / .cab-icon-card / .cab-section rules used on route & destination pages.
 */
:root{
  --cab-home-muted:#6B7280;
  --cab-home-line:#E7E4DC;
  --cab-home-cream:#FBF9F5;
}

/* ===== Hero (extends .cab-hero, homepage only) ===== */
.cab-home-hero{
  border-radius: 0 0 40px 40px;
  padding: 56px 24px 120px;
  text-align: left;
}
.cab-home-hero-inner{
  max-width: 1180px; margin: 0 auto;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center;
}
.cab-home-hero .cab-hero-badge{ margin-bottom: 18px; }
.cab-home-hero h1{ text-align:left; font-size: clamp(30px,4.2vw,46px); margin: 0 0 16px; }
.cab-home-hero-meta{ text-align:left; max-width: 460px; margin: 0 0 24px !important; }
.cab-home-hero .cab-hero-ctas{ justify-content: flex-start; margin-bottom: 26px; }
.cab-home-trust-points{ display:flex; gap:22px; flex-wrap:wrap; list-style:none; padding:0; margin:0; }
.cab-home-trust-points li{ display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:#dfe4f5; }
.cab-home-trust-points svg{ width:16px; height:16px; color: var(--cab-accent); flex-shrink:0; }

/* Ticket-style search widget (real #cab-home-search form) */
.cab-home-ticket{
  background:#fff; border-radius:20px; padding:8px;
  box-shadow: 0 30px 60px rgba(15,27,61,.25);
}
.cab-home-ticket-inner{ border:1.5px dashed #E1D9C8; border-radius:14px; padding:26px; }
.cab-home-ticket-inner h2{ font-size:16px; color:var(--cab-dark); margin:0 0 16px; }
.cab-home-ticket .cab-search-widget{ display:flex; flex-direction:column; gap:12px; }
.cab-home-ticket .cab-city-picker{ position:relative; }
.cab-home-ticket .cab-city-picker input[type="text"]{
  width:100%; box-sizing:border-box; border:1.5px solid var(--cab-home-line); border-radius:10px;
  padding:13px 14px; font-size:14.5px; font-weight:600; color:var(--cab-dark);
}
.cab-home-ticket .cab-city-picker input[type="text"]:focus{ outline:none; border-color:var(--cab-primary); }
.cab-home-ticket .cab-city-results{
  position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid #ccd0d4;
  max-height:200px; overflow-y:auto; z-index:20; display:none; border-radius:0 0 10px 10px; box-shadow:0 12px 24px rgba(0,0,0,.1);
}
.cab-home-ticket .cab-city-results div{ padding:9px 12px; cursor:pointer; font-size:13.5px; }
.cab-home-ticket .cab-city-results div:hover{ background: var(--cab-home-cream); }
.cab-home-ticket button.cab-btn-primary{ width:100%; justify-content:center; padding:14px; font-size:15.5px; }

/* ===== Trust / stats band ===== */
.cab-home-trust-band{ background: var(--cab-dark); padding: 56px 24px 30px; margin-top:-40px; padding-top:96px; }
.cab-home-trust-grid{
  max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center;
}
.cab-home-trust-grid .num{ font-size:clamp(26px,3vw,36px); font-weight:800; color:#fff; }
.cab-home-trust-grid .num span{ color: var(--cab-accent); }
.cab-home-trust-grid .label{ color:#B7BFD6; font-size:13px; margin-top:6px; font-weight:500; }

/* ===== Journey track ("How it works") ===== */
.cab-home-journey-track{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:10px; }
.cab-home-journey-track::before{
  content:''; position:absolute; top:34px; left:8%; right:8%; height:2px;
  background:repeating-linear-gradient(90deg, var(--cab-home-line) 0 8px, transparent 8px 16px);
}
.cab-home-journey-step{ position:relative; text-align:left; }
.cab-home-journey-step .num-badge{
  width:60px; height:60px; border-radius:50%; background:#fff; border:2px solid var(--cab-dark);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:18px; color:var(--cab-dark);
  margin-bottom:16px;
}
.cab-home-journey-step:nth-child(2) .num-badge,
.cab-home-journey-step:nth-child(4) .num-badge{ border-color: var(--cab-primary); color: var(--cab-primary); }
.cab-home-journey-step h3{ font-size:17px; margin:0 0 6px; }
.cab-home-journey-step p{ color:var(--cab-home-muted); font-size:14px; margin:0; }

/* ===== Fare calculator feature (real widget, restyled shell) ===== */
.cab-home-calc-feature{
  max-width:1100px; margin:0 auto; padding:50px 24px;
  background: var(--cab-home-cream); border-radius: var(--cab-radius);
}
.cab-home-calc-feature .cab-calc-compact h2{ text-align:left; font-size:26px; margin:0 0 10px; }
.cab-home-calc-feature .cab-calc-compact > p.cab-home-calc-lead{ color:var(--cab-home-muted); max-width:520px; margin:0 0 24px; }
.cab-calc-form--compact{ display:grid; grid-template-columns:1fr 1fr auto auto; gap:12px; align-items:end; }
.cab-calc-field{ position:relative; }
.cab-calc-field label{ display:block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--cab-home-muted); margin-bottom:5px; }
.cab-calc-field input{ width:100%; box-sizing:border-box; border:1.5px solid var(--cab-home-line); border-radius:10px; padding:12px 13px; font-size:14.5px; }
.cab-calc-results-dropdown{ position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid #ccd0d4; max-height:200px; overflow-y:auto; z-index:20; display:none; border-radius:0 0 10px 10px; }
.cab-calc-results-dropdown div{ padding:9px 12px; cursor:pointer; font-size:13.5px; }
.cab-calc-results-dropdown div:hover{ background:var(--cab-home-cream); }
.cab-calc-trip-toggle{ display:flex; gap:6px; background:#fff; border:1.5px solid var(--cab-home-line); padding:4px; border-radius:10px; }
.cab-calc-trip-btn{ border:none; background:none; padding:10px 14px; border-radius:7px; font-weight:700; font-size:13px; color:var(--cab-home-muted); cursor:pointer; }
.cab-calc-trip-btn.active{ background:var(--cab-dark); color:#fff; }
#cab-calc-output{ margin-top:22px; }
.cab-calc-full-link{ display:inline-block; margin-top:18px; font-weight:700; font-size:14px; color:var(--cab-primary); text-decoration:none; }
.cab-calc-full-link:hover{ text-decoration:underline; }
@media (max-width:820px){ .cab-calc-form--compact{ grid-template-columns:1fr 1fr; } }

/* ===== Compare (problem / solution) ===== */
.cab-home-compare{ max-width:1100px; margin:0 auto; padding:50px 24px; }
.cab-home-compare-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:10px; }
.cab-home-compare-card{ border-radius:var(--cab-radius); padding:28px; }
.cab-home-compare-card.old{ background:#fff; border:1.5px solid var(--cab-home-line); }
.cab-home-compare-card.new{ background:var(--cab-dark); color:#fff; }
.cab-home-compare-card h3{ font-size:17px; margin:0 0 16px; }
.cab-home-compare-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.cab-home-compare-list li{ display:flex; gap:10px; font-size:14px; align-items:flex-start; }
.cab-home-compare-card.old li{ color:var(--cab-home-muted); }
.cab-home-compare-card.new li{ color:#CBD2E8; }
.cab-home-compare-list svg{ width:17px; height:17px; flex-shrink:0; margin-top:2px; }
.cab-home-compare-card.old svg{ color:#D9564C; }
.cab-home-compare-card.new svg{ color: var(--cab-accent); }
@media (max-width:760px){ .cab-home-compare-grid{ grid-template-columns:1fr; } }

/* ===== Packages (placeholder, see reply notes) ===== */
.cab-home-packages{ max-width:1100px; margin:0 auto; padding:50px 24px; }
.cab-home-pkg-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:20px; }
.cab-home-pkg-card{ background:#fff; border-radius:var(--cab-radius); overflow:hidden; border:1.5px solid var(--cab-home-line); transition:transform .2s; }
.cab-home-pkg-card:hover{ transform:translateY(-4px); }
.cab-home-pkg-img{ height:170px; position:relative; }
.cab-home-pkg-img .badge{ position:absolute; top:12px; left:12px; background:#fff; color:var(--cab-dark); font-size:11.5px; font-weight:700; padding:4px 11px; border-radius:100px; }
.cab-home-pkg-body{ padding:20px; }
.cab-home-pkg-body h3{ font-size:17px; margin:0 0 6px; }
.cab-home-pkg-body p{ font-size:13px; color:var(--cab-home-muted); margin:0 0 14px; }
.cab-home-pkg-price{ font-weight:800; font-size:16px; color:var(--cab-dark); }
.cab-home-pkg-price span{ font-weight:500; font-size:12px; color:var(--cab-home-muted); }
@media (max-width:900px){ .cab-home-pkg-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .cab-home-pkg-grid{ grid-template-columns:1fr; } }

/* ===== Quick links 4-up ===== */
.cab-home-quicklinks{ max-width:1100px; margin:0 auto; padding:0 24px 50px; }
.cab-home-ql-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.cab-home-ql-card{ background:var(--cab-home-cream); border-radius:var(--cab-radius); padding:22px; min-height:150px; position:relative; transition:background .2s; }
.cab-home-ql-card:hover{ background:#F3EBD8; }
.cab-home-ql-card .arrow{ position:absolute; top:16px; right:16px; width:30px; height:30px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; }
.cab-home-ql-card .arrow svg{ width:14px; height:14px; }
.cab-home-ql-card h3{ font-size:15.5px; margin:50px 0 6px; }
.cab-home-ql-card p{ font-size:12.5px; color:var(--cab-home-muted); margin:0; }
@media (max-width:900px){ .cab-home-ql-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .cab-home-ql-grid{ grid-template-columns:1fr; } }

/* ===== Testimonials band ===== */
.cab-home-testimonials{ background: var(--cab-dark); padding:56px 24px; margin-top:10px; }
.cab-home-testimonials .cab-section-title h2,
.cab-home-testimonials .cab-section-eyebrow{ color:#fff; }
.cab-home-testimonials .cab-review-card{ background:#16234a; border:1px solid rgba(255,255,255,.08); }
.cab-home-testimonials .cab-review-card p{ color:#D7DCEC !important; }
.cab-home-testimonials .cab-review-author strong{ color:#fff; }

/* ===== Enquiry CTA band (real .cab-enquiry-form) ===== */
.cab-home-enquiry{ background: var(--cab-home-cream); padding:60px 24px; }
.cab-home-enquiry-grid{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.cab-home-enquiry-copy h2{ font-size:clamp(26px,3vw,32px); margin:0 0 14px; }
.cab-home-enquiry-copy p{ color:var(--cab-home-muted); font-size:15.5px; max-width:420px; margin:0; }
.cab-home-enquiry .cab-enquiry-form{ box-shadow:0 24px 54px rgba(15,27,61,.14); }
@media (max-width:900px){ .cab-home-enquiry-grid{ grid-template-columns:1fr; } }

/* ===== FAQ (native details/summary, no extra JS) ===== */
.cab-home-faq{ max-width:900px; margin:0 auto; padding:50px 24px; }
.cab-home-faq-item{ border-bottom:1px solid var(--cab-home-line); }
.cab-home-faq-item summary{
  cursor:pointer; padding:18px 0; font-weight:700; font-size:15.5px; color:var(--cab-dark);
  list-style:none; display:flex; justify-content:space-between; align-items:center;
}
.cab-home-faq-item summary::-webkit-details-marker{ display:none; }
.cab-home-faq-item summary::after{ content:'+'; font-size:22px; color:var(--cab-home-muted); font-weight:400; }
.cab-home-faq-item[open] summary::after{ content:'−'; }
.cab-home-faq-item p{ font-size:14.5px; color:var(--cab-home-muted); padding:0 0 18px; margin:0; max-width:640px; }

/* ===== Responsive: hero + journey + section grids ===== */
@media (max-width:980px){
  .cab-home-hero-inner{ grid-template-columns:1fr; }
  .cab-home-ticket{ order:-1; }
  .cab-home-trust-grid{ grid-template-columns:1fr 1fr; row-gap:26px; }
  .cab-home-journey-track{ grid-template-columns:1fr 1fr; row-gap:32px; }
  .cab-home-journey-track::before{ display:none; }
  .cab-home-pkg-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:600px){
  .cab-home-hero{ padding:40px 18px 100px; }
  .cab-calc-form--compact{ grid-template-columns:1fr; }
  .cab-home-trust-grid{ grid-template-columns:1fr 1fr; }
}
