/* ==========================================================================
   Hawaii King Kennels — Responsive
   Mobile-first overrides for site chrome + shared components. Verified at
   360 / 390 / 430 / 768 / 1024 / 1280 / 1440 / 1920px. No horizontal scroll.
   ========================================================================== */

/* ---------- ≤991.98px: swap the desktop pill nav for the hamburger + off-canvas ---------- */
@media (max-width: 991.98px) {
  .site-header__nav,
  .site-header__cta {
    display: none;
  }

  .site-header__toggle {
    display: flex;
  }

  .site-header__brandtag {
    display: none;
  }

  .site-footer__grid {
    grid-template-columns: 1fr 1fr;
  }

  .site-footer__brand-col {
    grid-column: 1 / -1;
  }

  .back-to-top {
    bottom: calc(var(--space-5) + 4px);
  }
}

/* ---------- ≥992px: the off-canvas panel never applies ---------- */
@media (min-width: 992px) {
  .mobile-nav {
    display: none;
  }
}

/* ---------- ≤767.98px ---------- */
@media (max-width: 767.98px) {
  .section {
    padding-block: clamp(40px, 10vw, 64px);
  }

  .site-footer__grid {
    grid-template-columns: 1fr;
    gap: var(--space-6);
    text-align: center;
  }

  .site-footer__brand,
  .site-footer__socials,
  .site-footer__col ul {
    align-items: center;
  }

  .site-footer__socials {
    justify-content: center;
  }

  .site-footer__brand {
    justify-content: center;
  }

  .site-footer__blurb {
    margin-inline: auto;
  }

  .site-footer__contact li,
  .site-footer__hours-line {
    justify-content: center;
  }

  .site-footer__bottom {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-3);
  }

  .cta-band__body {
    padding: var(--space-6) var(--space-4);
  }

  .btn-hkk-lg {
    width: 100%;
  }
}

/* ---------- ≤575.98px ---------- */
@media (max-width: 575.98px) {
  .card-hkk {
    padding: var(--space-5);
  }
}

/* ---------- ≥1400px: a little extra breathing room ---------- */
@media (min-width: 1400px) {
  :root {
    --container-max: 1320px;
  }
}