/* 响应式设计 */
@media (min-width: 1440px) {
    /* 大屏幕设备 - 瀑布流5列 */
    .masonry-grid {
        gap: 20px;
    }
    .gallery-item {
        flex: 0 0 calc(20% - 16px);
    }
}

@media (max-width: 1439px) and (min-width: 1025px) {
    /* 中等屏幕设备 - 瀑布流3列 */
    .masonry-grid {
        gap: 20px;
    }
    .gallery-item {
        flex: 0 0 calc(33.333% - 13.333px);
    }
}

@media (max-width: 1024px) {
    /* 平板设备 - 瀑布流2列 */
    .masonry-grid {
        gap: 15px;
    }
    .gallery-item {
        flex: 0 0 calc(50% - 7.5px);
        border-radius: 3px;
    }
}

@media (max-width: 768px) {
    /* 小型平板和大型手机 - 瀑布流2列 */
    .masonry-grid {
        gap: 15px;
    }
    .gallery-item {
        flex: 0 0 calc(50% - 7.5px);
    }

    .hero-content h2 {
        font-size: 36px;
    }

    .about-content {
        flex-direction: column;
        text-align: center;
    }

    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .contact-form {
        padding: 20px;
    }

    /* 页脚布局调整 */
    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .social-icons {
        justify-content: center;
    }
}

@media (max-width: 768px) {
    /* 移动端隐藏滚动条 */
    ::-webkit-scrollbar {
        display: none;
    }
    
    * {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
}

@media (max-width: 480px) {
    /* 超小手机设备 - 瀑布流1列 */
    .masonry-grid {
        gap: 10px;
    }
    .gallery-item {
        flex: 0 0 100%;
        border-radius: 2px;
    }
    
    /* 手机设备 */
    .hero-content h2 {
        font-size: 28px;
    }

    .hero-content p {
        font-size: 16px;
    }

    .section-title {
        font-size: 28px;
    }

    section {
        padding: 30px 0;
    }

    /* 调整容器内边距 */
    .container {
        padding: 0 15px;
    }

    /* 调整按钮大小 */
    .btn {
        padding: 10px 20px;
        font-size: 14px;
    }

    /* 调整加载更多按钮 */
    .load-more {
        padding: 10px 30px;
        font-size: 14px;
    }
}