/* ===================== CORREÇÃO SIMPLES DE LARGURA ===================== */
/* Apenas limitar a largura máxima sem quebrar nada */

/* ===================== CONTAINER PRINCIPAL ===================== */
/* Limitar largura máxima do container para evitar que o site se espalhe demais */

.container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===================== BANNER PRINCIPAL ===================== */
/* Limitar largura do banner também */

.hero-banner {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===================== SEÇÕES ===================== */
/* Limitar largura das seções */

section {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===================== GRID DE PRODUTOS ===================== */
/* Limitar número de colunas em telas muito grandes */

@media (min-width: 1400px) {
    .grid.grid-cols-2.md\\:grid-cols-3.lg\\:grid-cols-4 {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (min-width: 1600px) {
    .grid.grid-cols-2.md\\:grid-cols-3.lg\\:grid-cols-4 {
        grid-template-columns: repeat(5, 1fr) !important;
    }
}

@media (min-width: 1920px) {
    .grid.grid-cols-2.md\\:grid-cols-3.lg\\:grid-cols-4 {
        grid-template-columns: repeat(6, 1fr) !important;
    }
}

/* ===================== CORREÇÕES ESPECÍFICAS ===================== */

/* Garantir que o header também respeite o limite */
#site-header .container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Garantir que o menu de categorias também respeite o limite */
.category-nav .container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Garantir que a paginação também respeite o limite */
section.py-8.bg-gray-50 .container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
