/* ========================================
   实际分辨率修复 - Zoom版 (Real Resolution Fix Zoom)
   通过 CSS Zoom 属性实现完美的等比缩放
   ======================================== */

/* 1280px - 1900px 范围内的整体缩放 */
@media screen and (min-width: 1280px) and (max-width: 1899px) {
    
    body {
        /* 确保背景色铺满 */
        background-color: white; 
        /* 隐藏可能的水平滚动条 */
        overflow-x: hidden;
    }

    /* ⚠️ 关键修复：保持所有容器 1920px 宽度，让 zoom 统一缩放
     * 不强制宽度会导致布局错乱，zoom 会自动处理缩放比例
     */
    
    /* 所有主要容器保持 1920px 设计尺寸 */
    .main-wrapper, 
    .hero, 
    .opening-hours, 
    .exhibitions, 
    .about, 
    .location, 
    .footer {
        width: 1920px !important;
        max-width: 1920px !important;
        min-width: 1920px !important;
        box-sizing: border-box !important;
    }

    /* Header 特殊处理 - 保持1920px宽度配合zoom缩放 */
    .header {
        width: 1920px !important;
        max-width: 1920px !important;
        min-width: 1920px !important;
        /* 使用 left: 0 配合居中定位，避免transform导致的错位 */
        left: 50% !important;
        margin-left: -960px !important; /* 1920 / 2 = 960 */
        transform: none !important; 
    }
    
    .header.hide {
        transform: translateY(-100%) !important;
    }
    
    .header.show {
        transform: translateY(0) !important;
    }
    
    /* 侧边栏特殊处理 (about.html) */
    .sidebar {
        /* 确保侧边栏也按 1920px 布局定位 */
        /* 如果它是 fixed，zoom 应该也能处理 */
    }
}

/* Header 定位已在 header.css 中统一设置，此处不再重复定义 */
@media screen and (min-width: 1280px) and (max-width: 1899px) {
    /* header.css 已处理固定定位，由 zoom 统一缩放 */
}

/* 移动端 (<1280px) 保持之前的安全设置 */
@media screen and (max-width: 1279px) {
    .main-wrapper, .main {
        width: 100vw !important;
    }
    
    .hero, .opening-hours, .exhibitions, .about, .location, .footer {
        width: 100vw !important;
        position: relative !important;
        top: auto !important;
        left: auto !important;
        height: auto !important;
    }
}