/* ============================================================
   LISTAS DE FORNECEDORES — Responsivo
   breakpoints: 1024 · 880 · 768 (nav) · 560
   script.js alterna .active em .nav__toggle/.nav__menu — painel
   mobile = .nav__menu.active abaixo.
   ============================================================ */

@media (max-width: 1024px) {
    .hero__container { grid-template-columns: 1fr; gap: 40px; }

    .hero__content { max-width: none; }

    .hero-card { margin-left: 0 !important; margin-right: 0 !important; }

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

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

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

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

@media (max-width: 880px) {
    .footer__main { grid-template-columns: 1fr; gap: 30px; }

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

@media (max-width: 768px) {
    .nav__toggle { display: flex; }

    .nav__menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        background: var(--petrol-deep);
        border-bottom: 3px solid var(--cobre);
        padding: 10px 24px 16px;
        box-shadow: 0 18px 30px rgba(12, 51, 53, 0.35);
    }

    .nav__link {
        display: block;
        padding: 13px 4px;
        border-radius: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }

    .nav__item:last-child .nav__link { border-bottom: 0; }

    .hero { padding: calc(var(--header-h) + 44px) 0 56px; }

    .hero__stats { grid-template-columns: repeat(3, auto); gap: 8px; }

    .hero__stat { width: 92px; height: 92px; }

    .categories, .featured, .benefits, .testimonials { padding: 54px 0; }

    .categories__header, .featured__header, .benefits__header, .testimonials__header {
        margin-bottom: 34px;
    }

    .hero__search { max-width: none; }
}

@media (max-width: 560px) {
    .categories__grid { grid-template-columns: 1fr; }

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

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

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

    .category-card__subcategories { columns: 1; }

    .hero__stats { grid-template-columns: 1fr; justify-content: stretch; }

    .hero__stat { width: 100%; height: auto; border-radius: var(--radius); padding: 12px; transform: none; }

    .footer__bottom { flex-direction: column; align-items: flex-start; }
}