/* 移动端图片自适应优化 */

/* 通用图片自适应规则 */
@media screen and (max-width: 768px) {
    /* 所有图片基础自适应 */
    img {
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        box-sizing: border-box !important;
    }
    
    /* 防止图片溢出容器 */
    .container img,
    .content img,
    section img,
    .gallery-item img,
    .manufacturer-logo img,
    .solution-item img,
    .product-card img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
    
    /* Hero轮播图片优化 */
    .carousel-slide img,
    .slide-background {
        width: 100% !important;
        height: auto !important;
        min-height: 40vh !important;
        max-height: 60vh !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    
    /* Gallery画廊图片优化 */
    .gallery-image {
        width: 100% !important;
        height: auto !important;
        overflow: hidden !important;
    }
    
    .gallery-image img {
        width: 100% !important;
        height: auto !important;
        max-height: 250px !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    
    /* 产品展示图片优化 */
    .solution-presentation img,
    .product-presentation img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        margin: 0 auto !important;
        display: block !important;
    }
    
    /* Logo图片特殊优化 */
    .logo-img {
        max-width: 280px !important;
        height: auto !important;
        width: auto !important;
        object-fit: contain !important;
    }
    
    /* 解决方案图片优化 */
    .solutions img,
    .solution-detail-image img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
    }
}

/* 制造商图片横线问题修复 */
@media screen and (max-width: 768px) {
    /* 移除circuit-background.css中的装饰横线 */
    .manufacturer-item::before,
    .manufacturer-item::after {
        display: none !important;
        content: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
    
    /* 重新设计制造商卡片样式 */
    .manufacturer-item {
        background: white !important;
        border-radius: 10px !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08) !important;
        overflow: hidden !important;
        transition: all 0.3s ease !important;
        border: 1px solid rgba(0, 102, 204, 0.1) !important;
        position: relative !important;
        height: auto !important;
        min-height: 200px !important;
    }
    
    .manufacturer-item:hover {
        transform: translateY(-3px) !important;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
        border-color: var(--primary-color) !important;
    }
    
    /* 制造商Logo区域优化 */
    .manufacturer-logo {
        width: 100% !important;
        height: 120px !important;
        padding: 15px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: linear-gradient(145deg, #f8f9fa 0%, #ffffff 100%) !important;
        border-bottom: 2px solid rgba(0, 102, 204, 0.1) !important;
        position: relative !important;
    }
    
    .manufacturer-logo img {
        max-width: 85% !important;
        max-height: 85% !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center !important;
        filter: brightness(1.02) contrast(1.05) !important;
        transition: all 0.3s ease !important;
    }
    
    .manufacturer-item:hover .manufacturer-logo img {
        transform: scale(1.05) !important;
        filter: brightness(1.05) contrast(1.08) !important;
    }
    
    /* 制造商信息区域优化 */
    .manufacturer-info {
        width: 100% !important;
        padding: 20px 15px !important;
        background: linear-gradient(145deg, rgba(12, 80, 62, 0.03) 0%, rgba(32, 178, 170, 0.02) 100%) !important;
        text-align: center !important;
        border-top: none !important;
        min-height: 80px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    .manufacturer-info h3 {
        font-size: 1.1rem !important;
        margin: 0 0 8px 0 !important;
        color: var(--primary-color) !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
        text-align: center !important;
    }
    
    .manufacturer-info a {
        color: var(--secondary-color) !important;
        font-size: 0.9rem !important;
        text-decoration: none !important;
        transition: all 0.3s ease !important;
        display: inline-block !important;
    }
    
    .manufacturer-info a:hover {
        color: var(--primary-color) !important;
        transform: translateY(-1px) !important;
    }
}

/* 小屏幕图片进一步优化 */
@media screen and (max-width: 480px) {
    /* 图片容器优化 */
    .gallery-image img {
        max-height: 200px !important;
    }
    
    /* Hero图片优化 */
    .carousel-slide img,
    .slide-background {
        min-height: 35vh !important;
        max-height: 50vh !important;
    }
    
    /* 制造商Logo进一步优化 */
    .manufacturer-logo {
        height: 100px !important;
        padding: 10px !important;
    }
    
    .manufacturer-logo img {
        max-width: 90% !important;
        max-height: 90% !important;
    }
    
    /* 制造商信息进一步优化 */
    .manufacturer-info {
        padding: 15px 10px !important;
        min-height: 70px !important;
    }
    
    .manufacturer-info h3 {
        font-size: 1rem !important;
        margin: 0 0 5px 0 !important;
    }
    
    .manufacturer-info a {
        font-size: 0.85rem !important;
    }
}

/* 极小屏幕图片优化 */
@media screen and (max-width: 360px) {
    /* Gallery图片极小屏幕优化 */
    .gallery-image img {
        max-height: 180px !important;
    }
    
    /* Hero图片极小屏幕优化 */
    .carousel-slide img,
    .slide-background {
        min-height: 30vh !important;
        max-height: 45vh !important;
    }
    
    /* 制造商卡片极小屏幕优化 */
    .manufacturer-logo {
        height: 90px !important;
        padding: 8px !important;
    }
    
    .manufacturer-info {
        padding: 12px 8px !important;
        min-height: 60px !important;
    }
    
    .manufacturer-info h3 {
        font-size: 0.9rem !important;
        line-height: 1.2 !important;
    }
    
    .manufacturer-info a {
        font-size: 0.8rem !important;
    }
}

/* 特殊图片类型优化 */
@media screen and (max-width: 768px) {
    /* 背景图片优化 */
    .story-section .image-container,
    .about .story-image {
        width: 100% !important;
        height: auto !important;
        max-height: 300px !important;
        overflow: hidden !important;
    }
    
    .story-section .image-container img,
    .about .story-image img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    
    /* 视频缩略图优化 */
    .video-placeholder img,
    .youtube-container img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    
    /* 产品卡片图标优化 */
    .product-icon {
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* 确保所有图片容器不溢出 */
    .image-container,
    .img-container,
    .picture-container,
    .photo-container {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }
    
    /* 响应式图片网格 */
    .image-grid,
    .photo-grid,
    .gallery-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
        gap: 15px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 高分辨率设备图片优化 */
@media screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {
    img {
        image-rendering: -webkit-optimize-contrast !important;
        image-rendering: crisp-edges !important;
        -webkit-backface-visibility: hidden !important;
        backface-visibility: hidden !important;
    }
    
    .manufacturer-logo img,
    .gallery-image img,
    .logo-img {
        filter: brightness(1.02) contrast(1.05) saturate(1.03) !important;
        -webkit-filter: brightness(1.02) contrast(1.05) saturate(1.03) !important;
    }
}

/* 图片加载优化 */
@media screen and (max-width: 768px) {
    /* 懒加载优化 */
    img[loading="lazy"] {
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
    }
    
    img[loading="lazy"].loaded {
        opacity: 1 !important;
    }
    
    /* 图片加载错误处理 */
    img:not([src]),
    img[src=""],
    img[src*="placeholder"] {
        display: none !important;
    }
    
    /* 图片容器最小高度 */
    .image-loading {
        min-height: 150px !important;
        background: linear-gradient(145deg, #f8f9fa 0%, #e9ecef 100%) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #6c757d !important;
        font-size: 0.9rem !important;
    }
}

/* 触摸设备图片交互优化 */
@media screen and (max-width: 768px) and (pointer: coarse) {
    /* 触摸友好的图片交互 */
    .gallery-image,
    .manufacturer-logo,
    .story-image {
        cursor: pointer !important;
        -webkit-tap-highlight-color: rgba(0, 102, 204, 0.1) !important;
        tap-highlight-color: rgba(0, 102, 204, 0.1) !important;
    }
    
    /* 触摸反馈 */
    .gallery-image:active,
    .manufacturer-item:active {
        transform: scale(0.98) !important;
        transition: transform 0.1s ease !important;
    }
    
    /* 移除悬停效果，仅保留触摸效果 */
    .gallery-item:hover,
    .manufacturer-item:hover {
        transform: none !important;
    }
    
    .gallery-item:active,
    .manufacturer-item:active {
        transform: scale(0.98) translateY(2px) !important;
    }
}

/* 图片性能优化 */
@media screen and (max-width: 768px) {
    /* GPU加速 */
    .gallery-image,
    .manufacturer-logo,
    .carousel-slide,
    .story-image {
        will-change: transform !important;
        transform: translateZ(0) !important;
        -webkit-transform: translateZ(0) !important;
    }
    
    /* 减少重排和重绘 */
    img {
        contain: layout style paint !important;
    }
}

/* 移除所有装饰性伪元素 */
@media screen and (max-width: 768px) {
    /* 移除制造商装饰 */
    .manufacturer-item::before,
    .manufacturer-item::after,
    .manufacturer-logo::before,
    .manufacturer-logo::after,
    .manufacturer-info::before,
    .manufacturer-info::after {
        display: none !important;
        content: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
    
    /* 移除可能的其他装饰元素 */
    .gallery-item::before,
    .gallery-item::after,
    .product-card::before,
    .product-card::after {
        display: none !important;
        content: none !important;
    }
} 