@media (max-width: 1024px) {
  .sidebar {
    display: none;
  }

  .page {
    margin-left: 0;
    padding: var(--space-6) var(--space-4) calc(var(--space-16) + 60px);
  }

  .mobile-nav {
    display: block;
  }
}

@media (max-width: 768px) {
  .hero {
    padding: var(--space-4) 0;
  }

  .hero h1 {
    font-size: var(--text-3xl);
  }

  .lead {
    font-size: var(--text-base);
  }

  .search-bar {
    flex-direction: column;
  }

  .search-btn {
    width: 100%;
  }

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

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

  .filter-tags {
    gap: var(--space-2);
  }

  .filter-tag {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-xs);
  }

  .section-title {
    font-size: var(--text-xl);
  }

  .footer-content {
    flex-direction: column;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .hero h1 {
    font-size: var(--text-2xl);
  }

  .mobile-nav-item {
    font-size: 10px;
    padding: var(--space-1) var(--space-2);
  }

  .card {
    padding: var(--space-3);
  }

  .modal-content {
    margin: var(--space-4);
  }
}