/* 自定义动画效果 */

/* promotion-hashtags动画效果 - 类似于overlay-titles */
.promotion-countdown {
    position: relative;
    overflow: hidden;
}

.promotion-hashtags {
    position: relative;
    transition: all 0.3s ease;
}

.hashtag-outline, .hashtag-solid {
    transition: transform 0.5s ease;
}

/* 悬停时的动画效果 - 文字聚拢到中间 */
.promotion-countdown:hover .hashtag-outline:nth-child(1) {
    transform: translateY(142px); /* 移动到solid-title位置 */
}

.promotion-countdown:hover .hashtag-outline:nth-child(2) {
    transform: translateY(72px); /* 移动到solid-title位置 */
}

/* 下方文字向上聚拢 */
.promotion-countdown:hover .hashtag-outline:nth-child(4) {
    transform: translateY(-72px); /* 移动到solid-title位置 */
}

.promotion-countdown:hover .hashtag-outline:nth-child(5) {
    transform: translateY(-142px); /* 移动到solid-title位置 */
}

/* 确保hashtag-solid始终可见 */
.promotion-countdown:hover .hashtag-solid {
    z-index: 3;
}

/* 响应式调整 */
@media (max-width: 991px) {
    .promotion-countdown:hover .hashtag-outline:nth-child(1) {
        transform: translateY(120px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(2) {
        transform: translateY(60px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(4) {
        transform: translateY(-60px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(5) {
        transform: translateY(-120px);
    }
}

@media (max-width: 767px) {
    .promotion-countdown:hover .hashtag-outline:nth-child(1) {
        transform: translateY(80px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(2) {
        transform: translateY(40px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(4) {
        transform: translateY(-40px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(5) {
        transform: translateY(-80px);
    }
}

@media (max-width: 576px) {
    .promotion-countdown:hover .hashtag-outline:nth-child(1) {
        transform: translateY(60px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(2) {
        transform: translateY(30px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(4) {
        transform: translateY(-30px);
    }
    
    .promotion-countdown:hover .hashtag-outline:nth-child(5) {
        transform: translateY(-60px);
    }
} 