/* ==================== 响应式设计 ==================== */

/* 平板电脑尺寸 (768px - 1024px) */
@media (max-width: 1024px) {
    .experience-card {
        flex-direction: column;
        min-height: auto;
    }
    
    .experience-info {
        padding: 25px;
    }
    
    .experience-images {
        flex: none;
        width: 100%;
        padding: 25px;
    }
    
    .image-carousel {
        max-width: 100%;
    }
    
    .carousel-slide {
        height: 200px;
    }
}

/* 移动设备尺寸 (小于768px) */
@media (max-width: 768px) {
    /* 工作经历卡片优化 */
    .experience-card {
        margin-bottom: 20px;
    }
    
    /* 移动端隐藏PC端横线 */
    .experience-card::before {
        display: none;  /* 隐藏PC端的横线 */
    }
    
    .experience-info {
        padding: 20px;
    }
    
    .experience-images {
        padding: 20px;
    }
    
    /* 公司信息区域调整 */
    .company-info {
        position: relative;
        margin-bottom: 20px;  /* 减少底部间距，为横线留出空间 */
    }
    
    .company-name {
        font-size: 1.6rem;
        margin-bottom: 0;  /* 移除底部间距，横线将紧跟在名称后 */
        padding-bottom: 0;   /* 移除padding-bottom */
        background-color: transparent; /* 移除背景色 */
        padding-right: 0;     /* 移除右侧padding */
        display: block;       /* 改为块级元素 */
        position: relative;
    }
    
    /* 移动端横线位置：位于公司名称和时间之间 */
    .company-info::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;  /* 从company-info顶部开始 */
        margin-top: calc(1.6rem * 1.2 + 8px); /* 公司名称行高 + 适当间距 */
        height: 2px;
        background: var(--primary-color);
        z-index: 5;
        display: block;
    }
    
    /* 经历元信息（时间、地点等）调整 */
    .experience-meta {
        margin-top: 20px;  /* 增加顶部间距，确保横线和时间之间有适当距离 */
        padding-top: 12px; /* 增加顶部内边距 */
    }
    
    .work-content h4 {
        font-size: 1.2rem;
    }
    
    .carousel-slide {
        height: 180px;
    }
}

/* 小屏幕手机 (小于480px) */
@media (max-width: 480px) {
    .experience-card {
        margin-bottom: 15px;
    }
    
    /* 小屏幕确保PC端横线隐藏 */
    .experience-card::before {
        display: none;  /* 隐藏PC端的横线 */
    }
    
    .experience-info {
        padding: 15px;
    }
    
    .experience-images {
        padding: 15px;
    }
    
    /* 公司信息区域调整 */
    .company-info {
        margin-bottom: 18px;  /* 小屏幕减少间距 */
    }
    
    .company-name {
        font-size: 1.4rem;
        margin-bottom: 0;  /* 移除底部间距，横线将紧跟在名称后 */
    }
    
    /* 小屏幕横线位置调整 */
    .company-info::after {
        top: 0;  /* 从company-info顶部开始 */
        margin-top: calc(1.4rem * 1.2 + 6px); /* 小屏幕公司名称行高 + 适当间距 */
    }
    
    /* 经历元信息调整 */
    .experience-meta {
        margin-top: 18px;  /* 小屏幕减少间距 */
        padding-top: 10px; /* 小屏幕减少内边距 */
    }
    
    .meta-item {
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
    
    .meta-label {
        min-width: auto;
    }
    
    .carousel-slide {
        height: 150px;
    }
    
    .carousel-controls {
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }
    
    .carousel-indicators {
        order: 0;
        flex: 0 0 auto;
        margin: 0;
    }
    
    .carousel-prev, .carousel-next {
        font-size: 1.2rem;
        padding: 3px 3px;
        flex: 0 0 auto;
    }
}

/* ==================== 方向特定优化 ==================== */

/* 小屏幕手机 - 竖屏 */
@media (max-width: 480px) and (orientation: portrait) {
    .experience-images {
        padding: 12px;
    }
    
    .carousel-slide {
        height: auto;
    }
    
    .carousel-slide img {
        object-fit: contain;
        width: 100%;
        height: 100%;
    }
}

/* 小屏幕手机 - 横屏 */
@media (max-width: 480px) and (orientation: landscape) {
    .experience-images {
        min-height: 250px;
        padding: 8px;
    }
    
    .carousel-slide {
        height: 220px;
    }
    
    .carousel-slide img {
        object-fit: cover;
        max-width: 85%;
        height: 95%;
        border-radius: 6px;
    }
    
    .carousel-container {
        max-width: 75%;
    }
}

/* 中等屏幕手机 - 竖屏 */
@media (min-width: 481px) and (max-width: 768px) and (orientation: portrait) {
    .carousel-slide {
        height: 380px;
    }
    
    .experience-images {
        min-height: 450px;
    }
}

/* 中等屏幕手机 - 横屏 */
@media (min-width: 481px) and (max-width: 768px) and (orientation: landscape) {
    .carousel-slide {
        height: 300px;
    }
    
    .carousel-slide img {
        max-width: 88%;
        object-fit: cover;
    }
    
    .experience-images {
        min-height: 350px;
    }
}

/* 平板电脑横屏 */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
    .carousel-slide {
        height: 350px;
    }
    
    .carousel-slide img {
        max-width: 85%;
        object-fit: cover;
    }
    
    .experience-images {
        padding: 20px;
    }
}