/*
 * responsive.css
 * All media queries in one place. Breakpoints:
 *   --bp-lg: 900px  (tablet / small laptop)
 *   --bp-sm: 560px  (mobile)
 */

/* ══════════════════════════════════════════════════════════════════
   TABLET  ≤ 900px
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  /* Section spacing */
  section {
    padding-block: 68px;
  }

  /* Header: show hamburger, hide desktop nav links */
  .hamburger {
    display: flex;
  }

  .primary-nav__link {
    display: none;
  }

  .primary-nav .btn--sm {
    display: none;
  }

  /* Hero: stack into single column */
  .hero {
    padding-block: 44px 68px;
  }

  .hero .wrap {
    grid-template-columns: 1fr;
    gap: 56px;
  }

  .portrait {
    max-width: 290px;
    order: -1; /* photo first on mobile */
  }

  /* About: stack grid */
  .about__grid {
    grid-template-columns: 1fr;
    margin-top: 48px;
    gap: 36px;
  }

  .about__banner img {
    border-radius: var(--radius-md);
  }

  /* Cards: single column */
  .card-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  /* Steps: stack + horizontal divider */
  .steps-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .step-item + .step-item::before {
    left: 30%;
    right: 30%;
    top: -15px;
    bottom: auto;
    width: auto;
    height: 1px;
  }
}

/* ══════════════════════════════════════════════════════════════════
   MOBILE  ≤ 560px
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 560px) {
  /* Hero CTAs full-width */
  .hero__ctas .btn {
    width: 100%;
  }

  /* Trust items stacked */
  .hero__trust {
    gap: 14px;
    flex-direction: column;
  }

  /* Booker padding */
  .booker {
    padding: 26px 18px;
    border-radius: 20px;
  }

  /* Form: single column */
  .fields-grid {
    grid-template-columns: 1fr;
  }

  /* Mode chips: single column */
  .mode-grid {
    grid-template-columns: 1fr;
  }

  /* Payment total amount */
  .pay-total__amount {
    font-size: 1.5rem;
  }
}

