/* 图片轮播区域样式 - 已修正显示问题 */
            .image-carousel-section {
                padding: 60px 0 40px;
                background-color: #f8f9fa;
                border-top: 1px solid #e9ecef;
                border-bottom: 1px solid #e9ecef;
                margin-bottom: 40px;
            }
            
            .image-carousel-section .section-title {
                text-align: center;
                font-size: 2rem;
                color: var(--primary-color);
                margin-bottom: 10px;
            }
            
            .image-carousel-section .section-subtitle {
                text-align: center;
                color: #666;
                margin-bottom: 40px;
                font-size: 1.1rem;
                max-width: 600px;
                margin-left: auto;
                margin-right: auto;
            }
            
            .carousel-container {
                max-width: 1200px;
                margin: 0 auto;
                position: relative;
            }
            
            .carousel-wrapper {
                overflow: hidden;
                margin: 0 0px;
                position: relative;
            }
            
            .carousel-track {
                display: flex;
                transition: transform 0.5s ease-in-out;
                will-change: transform;
            }
            
            .carousel-slide {
                flex: 0 0 33.333%; /* 初始显示3张，每张占33.333% */
                padding: 0;
                box-sizing: border-box;
            }
            
            .carousel-image-container {
                margin:0 5px;
                background: white;
                border-radius: 8px;
                overflow: hidden;
                box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
                transition: transform 0.3s, box-shadow 0.3s;
                height: 320px; /* 增加高度以容纳标题和描述 */
                display: flex;
                flex-direction: column;
            }
            
            .carousel-image-container:hover {
                transform: translateY(-5px);
                box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
            }
            
            .carousel-image-wrapper {
                height: 200px; /* 图片区域高度 */
                overflow: hidden;
                flex-shrink: 0;
            }
            
            .carousel-image {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
                transition: transform 0.3s ease;
            }
            
            .carousel-image-container:hover .carousel-image {
                transform: scale(1.05);
            }
            
            .carousel-caption {
                padding: 15px;
                text-align: center;
                background: white;
                flex-grow: 1;
                display: flex;
                flex-direction: column;
                justify-content: center;
                border-top: 1px solid #f0f0f0;
            }
            
            .carousel-caption h3 {
                font-size: 1.1rem;
                color: var(--primary-color);
                margin-bottom: 8px;
                font-weight: 600;
                line-height: 1.3;
                margin: 0;
            }
            
            .carousel-caption p {
                font-size: 0.9rem;
                color: #666;
                margin: 0;
                line-height: 1.4;
            }
            
            .carousel-nav {
                display: flex;
                justify-content: center;
                align-items: center;
                margin-top: 30px;
                gap: 20px;
            }
            
            .carousel-btn {
                background: var(--secondary-color);
                color: white;
                border: none;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                transition: all 0.3s;
            }
            
            .carousel-btn:hover {
                background: var(--primary-color);
                transform: scale(1.1);
            }
            
            .carousel-btn:disabled {
                opacity: 0.5;
                cursor: not-allowed;
                transform: none;
            }
            
            .carousel-dots {
                display: flex;
                gap: 10px;
            }
            
            .carousel-dot {
                width: 12px;
                height: 12px;
                padding: 18px;
                margin: 0 8px;
                border-radius: 50%;
                background: #ddd;
                border: none;
                cursor: pointer;
                transition: background 0.3s;
            }
            
            .carousel-dot.active {
                background: var(--secondary-color);
            }

            .carousel-dot:focus {
                outline: 3px solid #0056b3;
                outline-offset: 3px;
            }

            .carousel-dot:hover {
                transform: scale(1.2);
            }

            .carousel-dot::before {
                content: '';
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                position: relative;
                width: 12px;
                height: 12px;
                border-radius: 50%;
                background-color: currentColor;
            }

            .visually-hidden {
                position: absolute !important;
                width: 1px !important;
                height: 1px !important;
                padding: 0 !important;
                margin: -1px !important;
                overflow: hidden !important;
                clip: rect(0, 0, 0, 0) !important;
                white-space: nowrap !important;
                border: 0 !important;
            }    
            
            /* SEO友好的加载状态 */
            .carousel-loading {
                display: flex;
                justify-content: center;
                align-items: center;
                min-height: 300px;
            }
            
            .carousel-loading .loading-spinner {
                width: 40px;
                height: 40px;
                border: 3px solid #f3f3f3;
                border-top: 3px solid var(--secondary-color);
                border-radius: 50%;
                animation: spin 1s linear infinite;
            }
            
            @keyframes spin {
                0% { transform: rotate(0deg); }
                100% { transform: rotate(360deg); }
            }
            
            /* 响应式设计 */
            @media (max-width: 1024px) {
                .carousel-slide {
                    flex: 0 0 33.333%; /* 中等屏幕显示3张 */
                }
                
                .carousel-image-container {
                    height: 300px;
                }
                
                .carousel-image-wrapper {
                    height: 180px;
                }
            }
            
            @media (max-width: 992px) {
                .carousel-slide {
                    flex: 0 0 50%; /* 小屏幕显示2张 */
                }
                
                .carousel-wrapper {
                    margin: 0 0px;
                }
                
                .image-carousel-section .section-title {
                    font-size: 1.5rem;
                }
                
                .image-carousel-section .section-subtitle {
                    font-size: 1rem;
                }
                
                .carousel-image-container {
                    height: 280px;
                }
                
                .carousel-image-wrapper {
                    height: 180px;
                }
            }
            
            @media (max-width: 480px) {
                .carousel-slide {
                    flex: 0 0 100%; /* 移动端显示1张 */
                }
                
                .carousel-image-container {
                    height: 260px;
                    max-width: 300px;
                    margin: 0 auto;
                }
                
                .carousel-image-wrapper {
                    height: 170px;
                }
                
                .carousel-caption h3 {
                    font-size: 1rem;
                }
                
                .carousel-caption p {
                    font-size: 0.85rem;
                }
            }