/* ==========================================================================
   Dr. Agro Organics - Dedicated Responsiveness Fixes
   ========================================================================== */

/* --- Mobile Specific Grid & Collage Adjustments (320px, 375px, 425px) --- */
@media (max-width: 576px) {
    .hero-redesign {
        padding: 50px 0 60px 0 !important;
    }

    .hero-title-big {
        font-size: 1.85rem !important;
        line-height: 1.25 !important;
        margin-bottom: 12px !important;
    }

    .hero-subtitle-medium {
        font-size: 1.05rem !important;
        margin-bottom: 15px !important;
    }

    .hero-trust-highlights {
        margin-bottom: 25px !important;
        gap: 10px !important;
    }

    .hero-trust-highlights li {
        font-size: 0.95rem !important;
    }

    .hero-collage-container {
        max-width: 100%;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }

    .collage-item.big-card {
        height: auto !important;
        padding: 15px !important;
    }

    .collage-box-visual {
        height: 105px !important;
    }
    .collage-box-visual p {
        font-size: 0.75rem !important;
        line-height: 1.2 !important;
        text-align: center;
        padding: 0 5px;
    }

    .experience-floating-badge {
        font-size: 0.85rem !important;
        padding: 8px 15px !important;
        bottom: -10px !important;
        right: 0 !important;
    }

    .stats-grid-redesign {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .stat-item-card {
        padding: 10px !important;
    }
}

/* --- Table & Scroll Containers Protection --- */
.specs-table-wrapper {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    margin-bottom: 20px !important;
}

.specs-table-wrapper table {
    width: 100% !important;
    min-width: 480px !important; /* Forces scroll inside wrapper on mobile */
}

/* --- Product Detail Layout Stacking (Below 992px) --- */
@media (max-width: 991px) {
    .product-detail-wrapper .grid-2-cols {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }

    .sticky-inquiry-box {
        position: static !important;
        margin-top: 20px !important;
    }
}

/* --- Horizontal Process Timeline Padding Adjustments --- */
.horizontal-timeline-container {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

.horizontal-timeline-flex {
    min-width: 780px !important;
}

/* --- Products and Category Archive Grid Layout --- */
.grid-layout-with-sidebar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

@media (min-width: 992px) {
    .grid-layout-with-sidebar {
        grid-template-columns: 3fr 1fr;
        gap: 40px;
    }
}

/* --- Header Banner Responsive Font Sizes --- */
@media (max-width: 768px) {
    .archive-header-banner,
    .category-header-banner,
    .product-header-banner {
        padding: 40px 0 !important;
        text-align: center !important;
    }
    .archive-title,
    .category-title,
    .product-title-main {
        font-size: 2rem !important;
    }
    .archive-subtitle,
    .category-subtitle {
        font-size: 1rem !important;
        margin: 10px auto 0 auto !important;
    }
    .sidebar-column {
        margin-top: 30px;
    }
    .site-logo img,
    .site-logo .custom-logo {
        max-height: 70px !important;
    }
    .main-header {
        padding: 4px 0 !important;
    }
}
