/* =========================================================
   Responsive overrides — mobile-first breakpoints
   ========================================================= */

/* ---- Tablet (<=1024px) ---- */
@media (max-width: 1024px) {
    :root { --header-height: 68px; }

    .category-grid { grid-template-columns: repeat(2, 1fr); }
    .promo-grid { grid-template-columns: repeat(2, 1fr); }
    .bank-grid { grid-template-columns: 1fr; }
    .cart-layout { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .cart-summary { position: static; }
    .site-footer__grid { grid-template-columns: 1fr 1fr; }
    .about-hero__grid { grid-template-columns: 1fr; }
    .about-hero__media { order: -1; }
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Mobile/tablet nav (<=1180px) ---- */
@media (max-width: 1180px) {
    .nav-toggle { display: flex; }

    .site-nav {
        position: fixed;
        top: var(--header-height);
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--color-white);
        transform: translateX(100%);
        transition: transform var(--transition-base);
        padding: var(--space-6) var(--space-5);
        overflow-y: auto;
        z-index: 600;
    }
    .site-nav.is-open {
        transform: translateX(0);
    }
    .site-nav__list {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-5);
    }
    .site-nav__list a {
        font-size: 1.1rem;
    }
}

/* ---- Mobile (<=768px) ---- */
@media (max-width: 768px) {
    .section { padding-block: var(--space-7); }

    .product-grid { grid-template-columns: 1fr; }
    .category-grid { grid-template-columns: 1fr; }
    .promo-grid { grid-template-columns: 1fr; }
    .safety-grid { grid-template-columns: 1fr; }
    .form-row { grid-template-columns: 1fr; }
    .site-footer__grid { grid-template-columns: 1fr; gap: var(--space-6); text-align: left; }
    .mission-vision-grid { grid-template-columns: 1fr; }
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }

    .product-card__body { padding: var(--space-3) var(--space-4); }
    .product-card__name { font-size: 0.9rem; }
    .product-card__offer { font-size: 1.05rem; }

    .contact-card, .form-card { padding: var(--space-5); }

    .bank-card__value { font-size: 0.85rem; }
}

/* ---- Small mobile (<=480px) ---- */
@media (max-width: 480px) {
    .container { padding-inline: var(--space-4); }

    .site-logo__text { display: none; }
    .site-header__inner { gap: var(--space-3); }

    .product-card__media { flex-basis: 38%; max-width: 38%; }
    .qty-stepper button { width: 30px; height: 30px; }

    .whatsapp-fab { width: 48px; height: 48px; font-size: 1.35rem; bottom: var(--space-5); right: var(--space-5); }
}

/* ---- Cart: mobile stacked cards vs desktop table ---- */
@media (min-width: 768px) {
    #cart-cards { display: none; }
}
@media (max-width: 767px) {
    #cart-table-wrap { display: none; }
}

@media print {
    .site-header, .site-footer, .whatsapp-fab, .search-bar, .btn-add, .qty-stepper { display: none !important; }
}