/* static/landing_2/css/deal-route.css
   Styles for the version-two per-route deal pages (templates/landing_2/direct-deal.html and
   cheaper-via-deal.html): hero header, price stats, and the expandable deal-date rows.
   The filter bar reuses .tag-filter from deal-page.css; builds on the variables in landing.css. */

/* ===== Hero: photo + title/stats/description ===== */
.deal-route__hero{ display:flex; flex-wrap:wrap; gap:18px; align-items:flex-start; }
.deal-route__heroimg{
  flex:0 1 420px; min-width:260px; aspect-ratio:4/2; object-fit:cover;
  border-radius:var(--radius); border:1px solid var(--border); box-shadow:var(--shadow);
}
.deal-route__intro{ flex:1 1 320px; min-width:260px; }
.deal-route__title{ margin:0 0 4px; font-size:32px; }
.deal-route__from{ margin:0 0 14px; color:var(--muted); }

.deal-route__stats{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.deal-route__stat{
  background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:8px 14px;
}
.deal-route__stat b{ display:block; font-size:18px; font-variant-numeric:tabular-nums; }
.deal-route__stat span{ font-size:12px; color:var(--muted); }
.deal-route__stat--save b{ color:var(--good); }

.deal-route__description{ margin:0; color:var(--muted); max-width:70ch; }

/* ===== Expandable deal-date rows ===== */
.deal-route__list{ display:flex; flex-direction:column; gap:10px; max-width:860px; margin-top:14px; }
.deal-row{ background:var(--panel); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.deal-row[open], .deal-row:hover{ border-color:rgba(0,166,237,.5); }

.deal-row__summary{
  list-style:none; cursor:pointer;
  display:grid; grid-template-columns:110px 90px 1fr auto; gap:10px; align-items:center;
  padding:12px 16px; font-weight:700;
}
.deal-row__summary::-webkit-details-marker{ display:none; }
.deal-row__price{ font-size:18px; font-variant-numeric:tabular-nums; }
.deal-row__dates{ color:var(--muted); font-weight:600; }
.deal-row__chevron{ transition:transform .15s ease; }
.deal-row[open] .deal-row__chevron{ transform:rotate(180deg); }

.deal-row__legs{
  border-top:1px solid var(--border); padding:10px 16px 14px;
  display:flex; flex-direction:column; gap:8px;
}
.deal-row__leg{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.deal-row__go{
  margin-left:auto; padding:6px 16px; border-radius:8px;
  background:var(--brand); color:#fff; font-weight:800; font-size:13px;
}

.deal-route__more{ color:var(--muted); text-align:center; }

/* Q&A variant of the row summary (about page): one wide text column + the chevron */
.deal-row__summary--about{ grid-template-columns:1fr auto; }
.deal-row__legs p{ margin:0; max-width:80ch; }
.deal-row__legs p + p{ margin-top:8px; }

@media (max-width:640px){
  .deal-row__summary{ grid-template-columns:auto auto 1fr auto; font-size:14px; padding:10px 12px; }
}