/* Below this width the header row can no longer hold the logo, the
   navigation and the actions including the phone number on one line. */
@media (max-width: 1200px) {
  .main-nav {
    height: auto;
    padding: 12px 0;
  }

  .nav-inner {
    flex-wrap: wrap;
    row-gap: 12px;
  }
}

@media (max-width: 900px) {
  .desktop-sticky {
    position: static;
    box-shadow: none;
  }

  .main-nav {
    height: auto;
    padding: 12px 0;
    backdrop-filter: none;
  }

  .nav-inner,
  .hero-inner,
  .content-grid,
  .footer-inner,
  .section-intro {
    width: min(100% - 28px, 720px);
  }

  .nav-links,
  .nav-actions .btn,
  .nav-actions .lang {
    display: none;
  }

  .mobile-menu {
    display: inline-flex;
  }

  .nav-inner.nav-open .nav-links {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    order: 3;
  }

  .nav-inner.nav-open .nav-links a {
    width: 100%;
    min-width: 0;
  }

  .hero {
    min-height: 560px;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.46) 0%, rgba(0, 0, 0, 0.18) 58%, rgba(0, 0, 0, 0.02) 100%),
      url("../images/main-page-dog.jpg") center center / cover no-repeat;
  }

  .hero-inner {
    padding: 44px 0 76px;
  }

  h1 {
    font-size: 42px;
  }

  .subtitle {
    font-size: 20px;
  }

  .hero-points {
    grid-template-columns: 1fr;
  }

  .section-intro {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 24px;
  }

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

  .faq-panel {
    position: static;
  }

  .form-panel {
    padding: 20px;
  }

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

  .span-2 {
    grid-column: auto;
  }

  .footer-contacts {
    gap: 6px;
    justify-content: center;
    margin-left: 0;
  }

  .footer-social,
  .footer-legal {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .footer-social > *:nth-child(2) {
    text-align: center;
  }

  html[lang="ru"] .footer-social {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 10px;
  }

  html[lang="ru"] .footer-contacts {
    justify-content: center;
  }

  html[lang="ru"] .footer-social > span {
    width: min(100%, 760px);
    justify-self: center;
    text-align: center;
  }

  .footer-legal > *:nth-child(1),
  .footer-legal > *:nth-child(2),
  .footer-legal > *:nth-child(3) {
    text-align: center;
  }
}

@media (max-width: 560px) {
  .nav-inner {
    justify-content: center;
    column-gap: 0;
  }

  .logo {
    flex: 0 0 100%;
    justify-content: center;
  }

  .nav-actions {
    width: 100%;
    max-width: 100%;
    justify-content: center;
    gap: clamp(6px, 2vw, 10px);
  }

  .nav-phone {
    gap: 6px;
    font-size: clamp(12px, 3.7vw, 15px);
  }

  .language-toggle {
    padding-inline: clamp(10px, 3vw, 14px);
  }

  .language-menu {
    right: auto;
    left: 0;
  }

  .mobile-menu {
    padding-inline: clamp(10px, 3vw, 14px);
  }

  .nav-inner.nav-open .nav-links {
    grid-template-columns: 1fr;
  }
}