@media (max-width: 980px) {
  .site-header {
    padding-inline: 20px;
  }

  .menu-toggle {
    display: grid;
  }

  .site-nav {
    position: absolute;
    left: 20px;
    right: 20px;
    top: calc(100% + 8px);
    display: none;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 10px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
  }

  .site-header.is-open .site-nav {
    display: grid;
  }

  .site-nav a {
    padding: 12px;
  }

  .site-nav a::after {
    display: none;
  }

  .hero,
  .about,
  .health,
  .contact-cta,
  .achievements {
    grid-template-columns: 1fr;
  }

  .hero {
    min-height: auto;
    padding-top: 44px;
  }

  .hero-media {
    min-height: 520px;
  }

  .trust-bar,
  .dog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .trust-bar article:nth-child(2n) {
    border-right: 0;
  }

  .trust-bar article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .litter-grid {
    grid-template-columns: 1fr;
  }

  .achievements img {
    min-height: 300px;
  }

  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
  }

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

  .site-footer nav {
    justify-content: start;
  }
}

@media (max-width: 680px) {
  :root {
    --shell: min(100vw - 28px, 1180px);
  }

  .brand strong {
    font-size: 21px;
  }

  .brand small {
    font-size: 9px;
  }

  .hero h1 {
    font-size: 44px;
  }

  .hero p {
    font-size: 17px;
  }

  .hero-actions,
  .button {
    width: 100%;
  }

  .hero-media {
    min-height: 430px;
  }

  .hero-media img {
    width: 72%;
  }

  .trust-bar,
  .dog-grid,
  .health-grid,
  .contact-form,
  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .trust-bar article,
  .health-grid article,
  .health-grid article:nth-child(2n),
  .health-grid article:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .trust-bar article:last-child,
  .health-grid article:last-child {
    border-bottom: 0;
  }

  .section-heading {
    align-items: start;
    flex-direction: column;
  }

  .litter-card {
    grid-template-columns: 1fr;
  }

  .litter-card img,
  .dog-card img,
  .gallery-grid img {
    height: 220px;
  }

  .about,
  .split-section,
  .dogs,
  .health,
  .gallery {
    padding-top: 56px;
  }

  .contact-cta {
    padding: 28px;
  }
}