/* ============================================
   Responsive Styles
   ============================================ */

@media (max-width: 1200px) {
    .container { padding: 0 18px; }
}

@media (max-width: 1024px) {
    .hero-banner { height: auto; }
    .banner-content h1 { font-size: 2.5rem; }
    .products-grid { grid-template-columns: repeat(2, 1fr); }
    .categories-grid { grid-template-columns: repeat(3, 1fr); }
    .scope-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .products-layout { grid-template-columns: 230px 1fr; }
    .products-grid-list { grid-template-columns: repeat(2, 1fr); }
    .news-grid { grid-template-columns: repeat(2, 1fr); }
    .news-detail-layout { grid-template-columns: 1fr 260px; }
}

@media (max-width: 768px) {
    .header-top { display: none; }
    .nav { display: none; }
    .mobile-toggle { display: flex; }
    .mobile-menu { display: block; }
    .header-inner { height: 68px; }
    .logo img { max-height: 42px; }

    .hero-banner { height: auto; }
    .banner-content h1 { font-size: 2rem; }
    .banner-content p { font-size: 1rem; }
    .banner-arrow { width: 40px; height: 40px; }

    section { padding: 55px 0; }
    .section-header { margin-bottom: 38px; }
    .section-header h2 { font-size: 1.7rem; }

    .about-grid { grid-template-columns: 1fr; gap: 35px; }
    .about-image::after { display: none; }
    .about-certifications { flex-direction: column; gap: 10px; }
    .products-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
    .scope-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: 1fr 1fr; }

    .products-layout { grid-template-columns: 1fr; }
    .products-sidebar { position: static; margin-bottom: 22px; }
    .products-grid-list { grid-template-columns: repeat(2, 1fr); }

    .product-detail-layout { grid-template-columns: 1fr; gap: 32px; }
    .product-gallery { position: static; }
    .attribute-table,
    .attribute-table tbody,
    .attribute-table tr,
    .attribute-table td { display: block; width: 100%; box-sizing: border-box; }
    .attribute-table tr { margin-bottom: 4px; border: 1px solid var(--border-light); border-radius: 6px; overflow: hidden; }
    .attribute-table td { border-bottom: 1px solid var(--border-light); }
    .attribute-table td:nth-child(odd) { background: #f8f9fa; font-weight: 600; }
    .attribute-table td:nth-child(even) { background: #fff; }
    .attribute-table td[colspan] { grid-column: auto; }

    .contact-grid { grid-template-columns: 1fr; }
    .news-grid { grid-template-columns: 1fr; }
    .news-detail-layout { grid-template-columns: 1fr; }
    .news-sidebar { position: static; }
    .news-navigation { flex-direction: column; }

    .page-banner { padding: 45px 0; }
    .page-banner h1 { font-size: 1.8rem; }

    /* 移动端浮动按钮：只显示 WhatsApp */
    .floating-contact {
        top: auto;
        bottom: 80px;
        right: 16px;
        transform: none;
        gap: 8px;
    }
    .floating-contact .fc-btn:not(.fc-whatsapp) {
        display: none;
    }
    .back-to-top { bottom: 22px; right: 20px; }
}

@media (max-width: 480px) {
    .hero-banner { height: auto; }
    .banner-content h1 { font-size: 1.6rem; }
    .banner-arrow { width: 34px; height: 34px; font-size: 0.8rem; }
    .products-grid { grid-template-columns: 1fr; }
    .categories-grid { grid-template-columns: 1fr; }
    .scope-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .products-grid-list { grid-template-columns: 1fr; }
    .page-banner h1 { font-size: 1.5rem; }
    .btn { padding: 10px 22px; font-size: 0.88rem; }
    .product-info-detail h2 { font-size: 1.4rem; }
    .floating-contact { top: auto; bottom: 70px; right: 14px; gap: 8px; transform: none; }
    .floating-contact .fc-btn { width: 46px; height: 46px; font-size: 1.2rem; }
    .floating-contact .fc-btn:not(.fc-whatsapp) { display: none; }
    .back-to-top { width: 40px; height: 40px; bottom: 18px; right: 14px; }
}