/* 动画容器样式 */
#animation-container {
    position: absolute;
    pointer-events: none; /* 确保动画不会影响按钮的点击事件 */
    z-index: 100;
}

/* 动画包装器样式 */
.animation-wrapper {
    width: 266px;
    height: 266px;
    position: relative;
    overflow: hidden;
}

/* 序列帧缩放比例，将376px缩放到266px */
.z_QR1_Clip_000,
.z_QR2_Clip_000,
.z_QR3_Clip_000,
.z_QR4_Clip_000,
.z_QR5_Clip_000 {
    transform-origin: top left;
    transform: scale(0.707); /* 266/376 ≈ 0.707 */
    width: 376px;
    height: 376px;
}

/* 修改所有CSS文件中的animation-fill-mode属性 */
.z_QR1_Clip_000,
.z_QR2_Clip_000,
.z_QR3_Clip_000,
.z_QR4_Clip_000,
.z_QR5_Clip_000 {
    animation-fill-mode: forwards !important; /* 覆盖原来的both设置 */
}

/* Slogan容器样式 */
#slogan-container {
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
}

.z_Final_Clip_000 {
    transform: scale(1.0);
    transform-origin: top left;
}
.z_Final_Clip_000 {
    animation-fill-mode: forwards !important; /* 覆盖原来的both设置 */
}

#slogan {
    opacity: 0;
    transition: opacity 2s ease;
    position: relative;
}

/* 显示状态 */
#slogan.show {
    opacity: 1;
}

/* Slogan 媒体查询：针对移动设备 */
@media (max-width: 768px) { /* 可根据实际需求调整断点（如640px、820px） */
    #slogan-container {
        position: fixed;
        top: 0px;
        left: 0px;
        transform: translate(-50%, -50%) scale(0.5);
    }

    /* 覆盖原有缩放样式 */
    .z_Final_Clip_000 {
        transform: scale(1) !important; /* 重置内部缩放，避免双重缩放 */
    }
}