/* ─────────────────────────────────────────────────
   RE-LOAD · Responsive
   Breakpoints
   ───────────────────────────────────────────────── */

/* ≤1200px — desktop compact */
@media (max-width: 1200px) {
  :root {
    --container-pad: clamp(20px, 3.5vw, 40px);
  }
  .hero__title { letter-spacing: -0.04em; }
  .section-title { letter-spacing: -0.03em; }
}

/* ≤960px — tablet: nav → mobile, grids stack */
@media (max-width: 960px) {
  .nav, .header__cta { display: none; }
  .nav-toggle { display: flex; }

  .audience {
    grid-template-columns: 1fr;
    gap: 48px;
    padding-block: clamp(56px, 6vw, 80px);
  }
  .audience--shippers .audience__copy { order: 1; }
  .audience--shippers .audience__visual { order: 2; }
  .audience--drivers .audience__copy { order: 1; }
  .audience--drivers .audience__visual { order: 2; }
  .audience__copy { max-width: 100%; }

  .about__grid { grid-template-columns: 1fr; gap: 48px; align-items: start; }
  .map-section__grid { grid-template-columns: 1fr; gap: 48px; }
  .team-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .team-card { padding: 24px 20px; }

  .contact__grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ≤720px — mobile */
@media (max-width: 720px) {
  :root {
    --section-pad: clamp(72px, 14vw, 96px);
    --container-pad: 20px;
  }

  .hero { padding-block: 56px 48px; }
  .hero__title {
    font-size: clamp(2.35rem, 10.8vw, 3rem);
    line-height: 0.98;
    letter-spacing: -0.04em;
    margin-block: 20px 24px;
  }
  .hero__title-em::before { inset: 0.18em -0.06em 0.10em -0.06em; transform: skew(-3deg); }
  .hero__lede { font-size: 1.0625rem; margin-bottom: 32px; }
  .hero__cta { flex-direction: column; align-items: stretch; gap: 10px; }
  .hero__cta .btn { width: 100%; }
  .hero__small { font-size: 11.5px; }

  .section-title { font-size: clamp(1.875rem, 8vw, 2.5rem); }
  .section-lede { font-size: 1.0625rem; }
  .section-head { margin-block-end: 48px; }

  .problem__story { margin-top: 36px; gap: 22px; }
  .problem__story p { font-size: 1rem; line-height: 1.65; }
  .problem__story p:first-of-type { font-size: 1.125rem; }

  .how__steps { grid-template-columns: 1fr; gap: 16px; }
  .how__step { padding: 28px 24px; }

  .audience__title { font-size: clamp(1.625rem, 7vw, 2.125rem); }
  .audience__text { font-size: 1rem; }
  .audience__list li { font-size: 15px; }

  .team-grid { grid-template-columns: 1fr; gap: 12px; }
  .team-card { padding: 24px 22px; }
  .team-card__avatar { width: 56px; height: 56px; font-size: 13px; }
  .team-card__name { font-size: 17px; }

  .phone { width: 100%; max-width: 320px; }
  .phone__body { min-height: 360px; }

  .contact__title { font-size: clamp(2.25rem, 10vw, 3rem); }
  .contact__lede { font-size: 1rem; margin-bottom: 40px; }
  .contact-card { padding: 24px; }
  .contact-card__icon { width: 44px; height: 44px; }

  .site-footer__inner { flex-direction: column; align-items: flex-start; gap: 20px; }
  .site-footer__nav { gap: 18px; }
  .site-footer__nav a { padding: 4px 0; min-height: 32px; display: inline-flex; align-items: center; }
}

/* ≤480px — small mobile */
@media (max-width: 480px) {
  :root { --container-pad: 18px; }

  .brand__word { font-size: 16px; }
  .header__inner { padding-block: 14px; }

  .hero__title { font-size: 2.1rem; line-height: 1.0; }
  .contact-card__value { font-size: 18px; }
  .shipper-card { padding: 28px 24px; }
  .shipper-card__title { font-size: 1.375rem; }
}

/* Landscape phone tweaks */
@media (max-height: 500px) and (orientation: landscape) {
  .hero { padding-block: 48px 40px; }
  .hero__title { font-size: clamp(1.75rem, 5vw, 2.5rem); }
}

/* High-contrast support */
@media (prefers-contrast: more) {
  :root {
    --color-ink-mute: #4a4a4a;
    --color-line: #b8b3a6;
  }
  .btn--primary { border-width: 2px; }
  .btn--ghost { border-width: 2px; }
}

/* Print styles */
@media print {
  .site-header, .site-footer, .nav-toggle, .mobile-nav, .contact { display: none; }
  body { color: #000; background: #fff; }
  a { text-decoration: underline; }
}