/* ==========================================================================
   responsive.css — breakpoints: 1600 · 1440 · 1280 · 1024 · 992 · 768 · 576 · 425 · 390 · 360
   Mobile experience mirrors the reference (hamburger nav, stacked cards, drawer filters).
   ========================================================================== */

/* ≤1600 — widen container a touch on large monitors handled by --container-wide */
@media (max-width: 1600px) {
  .container--wide { max-width: var(--container); }
}

/* ≤1440 */
@media (max-width: 1440px) {
  .hero__inner { gap: var(--sp-8); }
}

/* ≤1280 */
@media (max-width: 1280px) {
  /* row 1: from · swap · to · travelers ; row 2: depart · return · submit */
  .searchbar__grid { grid-template-columns: 1fr auto 1fr 1.3fr; grid-template-rows: none; grid-auto-rows: auto; }
  .searchbar__grid .field--from    { grid-column: 1; grid-row: auto; }
  .searchbar__grid .searchbar__swap{ grid-column: 2; grid-row: auto; }
  .searchbar__grid .field--to      { grid-column: 3; grid-row: auto; }
  .searchbar__grid .field--travelers { grid-column: 4; grid-row: auto; }
  .searchbar__grid .field--depart  { grid-column: 1 / 3; grid-row: auto; }
  .searchbar__grid .field--return  { grid-column: 3; grid-row: auto; }
  .searchbar__grid .searchbar__submit { grid-column: 4; grid-row: auto; align-self: end; }
  .searchbar.is-oneway .searchbar__grid .field--depart { grid-column: 1 / 4; }
  .results-layout { grid-template-columns: 260px 1fr; }
  .dest-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ≤1024 — tablet landscape */
@media (max-width: 1024px) {
  :root { --nav-h: 66px; }
  .hero__inner { grid-template-columns: 1fr; text-align: left; }
  .hero__art { display: none; }
  .hero__sub { max-width: 60ch; }
  .checkout-layout { grid-template-columns: 1fr 340px; }
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer__news { grid-column: 1 / -1; }
  .value-grid, .services, .features { gap: var(--sp-5); }
  .stats { grid-template-columns: repeat(4, 1fr); }
  .dest-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ≤992 — tablet */
@media (max-width: 992px) {
  .nav__menu { display: none; }
  .nav__actions .nav__pill span.pill-label { display: none; }
  .nav__burger { display: grid; }
  .features, .services, .value-grid { grid-template-columns: 1fr 1fr; }
  .checkout-layout { grid-template-columns: 1fr; }
  .summary { position: static; }
  .legal-layout { grid-template-columns: 1fr; }
  .toc { position: static; display: none; }
  .contact-layout { grid-template-columns: 1fr; }
  .cta-band { flex-direction: column; text-align: center; align-items: center; }
  .cta-band p { margin-inline: auto; }
}

/* ≤768 — the reference "mobile" layouts kick in here */
@media (max-width: 768px) {
  .section { padding-block: clamp(40px, 8vw, 56px); }

  /* Search form stacks fully — reset all column placements from wider breakpoints */
  .searchbar { margin-top: -44px; padding: var(--sp-5); border-radius: var(--r-lg); }
  .searchbar__grid,
  .searchbar.is-oneway .searchbar__grid { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
  .searchbar__grid > * { grid-column: 1 !important; grid-row: auto !important; }
  .searchbar.is-oneway [data-return-field] { display: none; }
  .searchbar__swap { justify-self: center; margin: -4px 0; transform: rotate(90deg); }
  .searchbar__swap:hover { transform: rotate(270deg); }
  .searchbar .btn { grid-column: auto; }
  /* popover: full width under the trigger on phones */
  .pax-picker__pop { width: 100%; right: auto; left: 0; }

  .hero__cta { width: 100%; }
  .hero__cta .btn { flex: 1; }

  /* Results → drawer filters */
  .results-layout { grid-template-columns: 1fr; }
  .filters {
    position: fixed; inset: 0 0 0 auto; width: min(90vw, 340px); z-index: var(--z-drawer);
    background: var(--surface); box-shadow: var(--sh-pop); padding: 20px; overflow-y: auto;
    transform: translateX(100%); transition: transform var(--t-slow) var(--ease); top: 0; height: 100dvh;
  }
  .filters.is-open { transform: translateX(0); }
  .filters__mobtoggle { display: inline-flex; }
  .filters__closebtn { display: grid; }
  .results-main__bar { position: sticky; top: calc(var(--nav-h) + 8px); background: var(--surface-2); padding: 10px 0; z-index: 10; }

  /* Flight cards stack (price under details, matching mobile mock) */
  .flight-card { grid-template-columns: 1fr; }
  .flight-card__side { align-items: stretch; text-align: left; border-left: 0; border-top: 1px solid var(--border-soft);
    flex-direction: row; align-items: center; justify-content: space-between; }
  .flight-card__side .btn { width: auto; }
  .flight-card__route { grid-template-columns: 1fr; gap: var(--sp-3); }
  .airline { min-width: 0; }
  .flight-card__route .airline { grid-row: 1; }

  /* Forms stack */
  .form-grid, .form-grid--3 { grid-template-columns: 1fr; }
  .form-grid .col-span-2, .form-grid .col-span-3 { grid-column: auto; }

  /* Footer */
  .footer__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
  .footer__brand { grid-column: 1 / -1; }
  .footer__bottom .container { flex-direction: column; text-align: center; }

  .stats { grid-template-columns: repeat(2, 1fr); }
  .features, .services, .value-grid { grid-template-columns: 1fr; }
  .subhead__inner { flex-direction: column; }
  .sel-flight { flex-direction: column; align-items: flex-start; }
}

/* ≤576 */
@media (max-width: 576px) {
  :root { --gutter: 16px; }
  .brand__name { font-size: 1.08rem; }
  .hero__title { font-size: clamp(1.8rem, 7vw, 2.3rem); }
  .searchbar .tabs { width: 100%; justify-content: space-between; }
  .searchbar .tab { flex: 1; padding: 9px 8px; }
  .confirm-actions .btn, .err-actions .btn { flex: 1; }
  .card-visual { max-width: 100%; }
  .flight-card__route { grid-template-columns: auto 1fr auto; }
  .flight-card__route .airline { grid-column: 1 / -1; }
  .timepoint__time { font-size: 1.15rem; }
  .wallet-grid { grid-template-columns: 1fr 1fr; }
}

/* ≤425 */
@media (max-width: 425px) {
  .section-head p, .hero__sub { font-size: var(--fs-base); }
  .stats { grid-template-columns: 1fr 1fr; }
  .footer__grid { grid-template-columns: 1fr; }
  .footer__social { justify-content: flex-start; }
  .btn--lg { padding: 14px 22px; }
  .drawer { width: 88vw; }
  .flight-card__price { font-size: 1.5rem; }
}

/* ≤390 */
@media (max-width: 390px) {
  .brand__mark { width: 32px; height: 32px; }
  .confirm-ref { font-size: var(--fs-xs); }
  .timepoint__time { font-size: 1.05rem; }
}

/* ≤360 */
@media (max-width: 360px) {
  :root { --gutter: 14px; }
  .searchbar { padding: 16px; }
  .block__body, .card__body { padding: 18px; }
  .hero__trust { gap: 14px; }
}