/* ====
   RESPONSIVE ADJUSTMENTS
   ==== */

@media (max-width: 1024px) {
    .halal-container {
        padding: 0 16px;
    }
}

@media (max-width: 768px) {
    .halal-hero-title {
        font-size: 2.5rem;
    }
    
    .quick-access-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .products-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .halal-hero-title {
        font-size: 2rem;
    }
    
    .quick-access-grid {
        grid-template-columns: 1fr;
    }
    
    .halal-nav-btn {
        font-size: 0.75rem;
        padding: 6px 10px;
    }
}