@media (max-width: 1100px) {
  .desktop-nav,
  .header-cta {
    display: none;
  }

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

  .desktop-nav {
    position: fixed;
    inset: 82px 0 auto 0;
    height: calc(100vh - 82px);
    background: rgba(17, 24, 32, 0.62);
  }

  body.menu-open .desktop-nav {
    display: block;
  }

  .desktop-nav .nav-list {
    width: min(100%, 380px);
    height: 100%;
    margin-left: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 24px;
    background: #f8faf8;
    color: var(--color-secondary);
    box-shadow: var(--shadow);
  }

  .desktop-nav .nav-list a {
    display: block;
    border-radius: 4px;
    padding: 13px 10px;
  }

  .desktop-nav .nav-list a:hover {
    background: rgba(33, 79, 98, 0.08);
    color: var(--color-primary);
  }

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

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

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

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

@media (max-width: 768px) {
  :root {
    --section-spacing: 64px;
  }

  .grid-2,
  .grid-3,
  .grid-4,
  .grid-5,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .hero {
    min-height: auto;
  }

  .hero-grid {
    padding: 42px 0;
  }

  .button {
    width: 100%;
  }

  .hero-actions,
  .inline-actions,
  .cta-inner,
  .footer-bottom .container {
    flex-direction: column;
    align-items: stretch;
  }

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

  .cookie-banner {
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: none;
  }
}

@media (max-width: 420px) {
  .container {
    width: min(100% - 24px, var(--container-width));
  }

  .logo span:last-child {
    max-width: 170px;
  }

  .form-card,
  .card {
    padding: 20px;
  }
}