/* ===== 卓越证件制作中心 - 响应式样式 ===== */

/* ===== 平板 768px 断点 ===== */
@media (max-width: 768px) {
    .nav {
        position: fixed;
        top: 64px;
        right: 0;
        width: 100%;
        max-width: 320px;
        height: calc(100vh - 64px);
        background: #fff;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        padding: 20px;
        box-shadow: -4px 0 24px rgba(233, 30, 99, .14);
        transform: translateX(110%);
        transition: transform .35s ease;
        align-content: flex-start;
    }
    .nav.active { transform: translateX(0); }
    .nav a {
        width: calc(50% - 5px);
        text-align: center;
        padding: 14px 8px;
        font-size: 15px;
        border: 1px solid var(--border);
        border-radius: 14px;
    }
    .hamburger { display: flex; }

    .banner-slide { height: 330px; }
    .banner-slide .overlay h2 { font-size: 26px; }
    .banner-slide .overlay p { font-size: 15px; }

    .page-banner { padding: 50px 18px 44px; }
    .page-banner h1 { font-size: 26px; }
    .page-banner p { font-size: 15px; }

    .section { padding: 52px 0; }
    .section-title h2 { font-size: 26px; }
    .section-title { margin-bottom: 32px; }

    .about-grid { grid-template-columns: 1fr; gap: 28px; }
    .about-img img { height: 280px; }

    .masonry { column-count: 2; column-gap: 16px; }
    .masonry-item { margin-bottom: 16px; }

    .products-grid, .cases-grid, .reviews-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
    .product-card img, .case-card img, .masonry-item img { height: 180px; }

    .contact-grid { grid-template-columns: 1fr; gap: 24px; }
    .article-layout { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .links-grid { grid-template-columns: repeat(3, 1fr); }

    .footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
    .content-page { padding: 24px; }
    .content-page h1 { font-size: 23px; }
    .article-body h2 { font-size: 19px; }

    .news-item { flex-direction: column; gap: 14px; }
}

/* ===== 手机 480px 断点 ===== */
@media (max-width: 480px) {
    body { font-size: 14px; }
    .header-inner { padding: 10px 14px; }
    .logo { font-size: 18px; }
    .logo span { font-size: 9px; }

    .nav { max-width: 100%; }
    .nav a { width: 100%; }

    .banner-slide { height: 240px; }
    .banner-slide .overlay h2 { font-size: 20px; }
    .banner-slide .overlay p { font-size: 13px; }
    .banner-btn { width: 36px; height: 36px; font-size: 24px; }

    .page-banner { padding: 40px 14px 36px; border-radius: 0 0 26px 26px; }
    .page-banner h1 { font-size: 22px; }
    .page-banner::before, .page-banner::after { font-size: 60px; }

    .section { padding: 40px 0; }
    .section-title h2 { font-size: 22px; }
    .section-title p { font-size: 14px; }

    .masonry { column-count: 1; }

    .products-grid, .cases-grid, .reviews-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .product-card img, .case-card img, .masonry-item img { height: 200px; }

    .stats-grid { grid-template-columns: 1fr; }
    .links-grid { grid-template-columns: repeat(2, 1fr); }
    .about-features { grid-template-columns: 1fr; }

    .footer-grid { grid-template-columns: 1fr; gap: 20px; text-align: center; }
    .footer-col a { display: inline; }

    .contact-info, .contact-form { padding: 24px 18px; }

    .content-page { padding: 18px; }
    .content-page h1 { font-size: 20px; }
    .content-meta { gap: 10px; font-size: 12px; }
    .article-body h2 { font-size: 18px; }
    .article-body img { max-height: 220px; }

    .floating-contact { right: 12px; bottom: 80px; }
    .floating-contact a { width: 46px; height: 46px; font-size: 20px; }
    .back-top { right: 12px; bottom: 140px; width: 42px; height: 42px; }
}