/* ==========================================================================
   INNOBATIS Responsive
   ========================================================================== */

/* ---------- Tablet (max 1024px) ---------- */
@media (max-width: 1024px) {
    :root {
        --ib-text-5xl: 2.5rem;
        --ib-text-4xl: 2rem;
        --ib-text-3xl: 1.5rem;
    }

    .ib-footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--ib-space-2xl);
    }

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

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

    .ib-testimonials > :last-child {
        display: none;
    }

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

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

    .ib-about-intro {
        gap: var(--ib-space-2xl);
    }

    .ib-catalog-filters__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .ib-specs-grid {
        grid-template-columns: 1fr;
    }

    .ib-contact-cards {
        grid-template-columns: 1fr;
    }

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

/* ---------- Mobile Nav (max 768px) ---------- */
@media (max-width: 768px) {
    .ib-topbar__text {
        display: none;
    }

    .ib-topbar__sep {
        display: none;
    }

    .ib-hamburger {
        display: flex;
    }

    .ib-header__actions {
        display: none;
    }

    .ib-nav {
        position: fixed;
        top: calc(var(--ib-topbar-height) + var(--ib-header-height));
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--ib-white);
        z-index: 99;
        padding: var(--ib-space-xl);
        transform: translateX(100%);
        transition: transform var(--ib-transition-slow);
        overflow-y: auto;
    }

    .ib-nav.open {
        transform: translateX(0);
    }

    .ib-nav__list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .ib-nav__list a {
        padding: var(--ib-space-md) 0;
        font-size: var(--ib-text-lg);
        border-bottom: 1px solid var(--ib-gray-100);
    }

    .ib-nav__list a::after {
        display: none;
    }

    .ib-nav__list .sub-menu {
        position: static;
        box-shadow: none;
        padding: 0 0 0 var(--ib-space-lg);
        display: block;
    }

    .ib-nav__list .sub-menu a {
        font-size: var(--ib-text-base);
    }

    /* Mobile footer CTA button */
    .ib-nav::after {
        content: '';
        display: block;
        padding-top: var(--ib-space-xl);
    }

    /* Hero */
    .ib-hero {
        min-height: 500px;
    }

    .ib-hero__content h1 {
        font-size: var(--ib-text-3xl);
    }

    .ib-hero__actions {
        flex-direction: column;
    }

    /* Grids */
    .ib-footer__grid {
        grid-template-columns: 1fr;
    }

    .ib-pillars {
        grid-template-columns: 1fr;
    }

    .ib-testimonials {
        grid-template-columns: 1fr;
    }

    .ib-testimonials > :nth-child(n+3) {
        display: none;
    }

    .ib-about-intro {
        grid-template-columns: 1fr;
    }

    .ib-values {
        grid-template-columns: 1fr;
    }

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

    .ib-catalog-filters__grid {
        grid-template-columns: 1fr 1fr;
    }

    .ib-grid-3 {
        grid-template-columns: 1fr;
    }

    .ib-grid-2 {
        grid-template-columns: 1fr;
    }

    .ib-options-list {
        grid-template-columns: 1fr;
    }

    .ib-gallery {
        grid-template-columns: repeat(4, 1fr);
    }

    .ib-cta-section h2 {
        font-size: var(--ib-text-2xl);
    }

    .ib-cta-section__actions {
        flex-direction: column;
        align-items: center;
    }

    .ib-footer__bottom {
        flex-direction: column;
        gap: var(--ib-space-md);
        text-align: center;
    }

    .ib-footer__legal {
        justify-content: center;
    }

    .ib-certifications {
        gap: var(--ib-space-xl);
    }

    /* Product page */
    .ib-product-layout {
        grid-template-columns: 1fr !important;
    }

    .ib-product-sidebar {
        position: static;
    }
}

/* ---------- Small Mobile (max 480px) ---------- */
@media (max-width: 480px) {
    :root {
        --ib-text-5xl: 2rem;
        --ib-text-4xl: 1.75rem;
        --ib-text-3xl: 1.375rem;
    }

    .ib-container {
        padding: 0 var(--ib-space-md);
    }

    .ib-hero {
        min-height: 400px;
    }

    .ib-section {
        padding: var(--ib-space-3xl) 0;
    }

    .ib-catalog-filters__grid {
        grid-template-columns: 1fr;
    }

    .ib-team {
        grid-template-columns: 1fr;
    }

    .ib-gallery {
        grid-template-columns: repeat(3, 1fr);
    }

    .ib-404 h1 {
        font-size: 5rem;
    }
}

/* ---------- WooCommerce overrides ---------- */
.woocommerce-notices-wrapper,
.woocommerce-result-count,
.woocommerce-ordering {
    display: none;
}

.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--ib-space-xl);
}

@media (max-width: 1024px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .woocommerce ul.products {
        grid-template-columns: 1fr;
    }
}

.woocommerce ul.products li.product {
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
}

/* WC Tabs */
.woocommerce-tabs {
    margin-top: var(--ib-space-3xl);
}

.woocommerce-tabs ul.tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--ib-gray-200);
    margin-bottom: var(--ib-space-xl);
    padding: 0;
}

.woocommerce-tabs ul.tabs::before,
.woocommerce-tabs ul.tabs::after {
    display: none;
}

.woocommerce-tabs ul.tabs li {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
}

.woocommerce-tabs ul.tabs li a {
    padding: var(--ib-space-md) var(--ib-space-xl);
    font-weight: 500;
    color: var(--ib-gray-500);
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    display: block;
}

.woocommerce-tabs ul.tabs li.active a {
    color: var(--ib-primary);
    border-bottom-color: var(--ib-accent);
    font-weight: 600;
}

.woocommerce-tabs .panel {
    padding: 0;
    border: none;
    box-shadow: none;
    background: none;
}
