@media (max-width: 992px) {

            .search-bar {
                width: 100%;
                max-width: 400px;
            }

            .community-container {
                grid-template-columns: 1fr;
            }
            
            .header-container {
                flex-direction: column;
                gap: 1.5rem;
            }
            
            .left-section {
                flex-direction: column;
                gap: 1rem;
                width: 100%;
                text-align: center;
            }
            
            .nav-links {
                gap: 1.5rem;
                justify-content: center;
            }
            
            .auth-buttons {
                margin-left: 0;
                justify-content: center;
                width: 100%;
            }
        }

        @media (max-width: 768px) {
            .community-hero h1 {
                font-size: 2.25rem;
            }
            
            .community-hero p {
                font-size: 1.1rem;
            }
            
            .section-title {
                font-size: 1.5rem;
            }
            
            .community-hero-buttons {
                flex-direction: column;
                align-items: center;
            }
            
            .btn {
                width: 100%;
                max-width: 300px;
            }
        }

        .center-section {
          display: flex;
          justify-content: center;
          flex: 0;
          margin: 0 10rem;
         }

         .search-bar {
            position: relative;
            width: 700px;
        }

        .search-bar input {
            width: 100%;
            padding: 0.75rem 1rem 0.75rem 3rem;
            border-radius: 8px;
            border: none;
            background: var(--dark-light);
            color: var(--light);
            font-size: 0.95rem;
            transition: var(--transition);
        }

        .search-bar input:focus {
            outline: none;
            box-shadow: 0 0 0 2px var(--primary);
        }

        .search-icon {
            position: absolute;
            left: 1rem;
            top: 50%;
            transform: translateY(-50%);
            color: var(--gray);
        }

        @media (max-width: 576px) {
            .header, .community-hero, .community-container {
                padding-left: 1.5rem;
                padding-right: 1.5rem;
            }
            
            .nav-links {
                gap: 1rem;
                flex-wrap: wrap;
                justify-content: center;
            }
            
            .community-hero h1 {
                font-size: 2rem;
            }
            
            .category-header {
                flex-direction: column;
                align-items: flex-start;
            }
            
            .category-icon {
                margin-bottom: 1rem;
            }
            
            .discussion-header {
                flex-direction: column;
                gap: 0.5rem;
            }
            
            .discussion-meta {
                flex-direction: column;
                gap: 0.5rem;
            }
        }